/*
 Theme Name: KFV Verkehrstechnik
 Template: hello-elementor
 Version: 1.0.0
 Author: KFV IT
 Text Domain: kfv-verkehrstechnik
 Description: Lightweight Hello child theme for the Verkehrstechnik site.
*/


@media (max-width: 600px) {
	* {
		word-break: break-word;
		hyphens: auto;
	}
}

.zebra {
	background-color: transparent;
    background-image: repeating-linear-gradient(to right, #EFF3F7 0, #EFF3F7 32px, transparent 32px, transparent 64px);
    background-size: 64px 100%;
}

/* Style for [kfv-cta-button] shortcode - START */
.kfv-cta-button {
	font-family: "Cabin", Sans-serif;
    font-size: 17px;
    font-weight: 700;
    line-height: 180%;
    letter-spacing: 0px;
    padding: 8px 24px 8px 24px;
}
/* Style for [kfv-cta-button] shortcode - END */



.news-content h2 {
	margin-top: 1.5em;
}

.news-content h3 {
	margin-top: 1.4em;
	color: var(--e-global-color-primary);
}

.news-content h4,
.news-content h5,
.news-content h6 {
	margin-top: 1em;
}

.news-content ul {
	list-style-type: square;
}

.news-content ul li::marker {
	color: var(--e-global-color-primary);
}

.news-content .news-btn {
	line-height: .5;
	margin: 1em;
	margin-left: 0;
}



/* Header Show/Hide Search Input - START */
#header-search {
  display: inline-flex;
  opacity: 0;
  transform: translateX(10px);
  transition: opacity 0.25s ease, transform 0.25s ease;
  pointer-events: none;
}

#header-search.is-open {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}
/* Header Show/Hide Search Input - END */



/* Header on Start Page - START */
.header-transparent .logo-blue {
	display: none;
}

.header-transparent.elementor-sticky--active.elementor-sticky--effects {
	background-image: none !important;
	background-color: #ffffff !important;
}

.header-transparent.elementor-sticky--active.elementor-sticky--effects .logo-blue {
	display: block;
}

.header-transparent.elementor-sticky--active.elementor-sticky--effects .logo-white {
	display: none;
}

.header-transparent.elementor-sticky--active.elementor-sticky--effects .header-leistungen-btn a,
.header-transparent.elementor-sticky--active.elementor-sticky--effects .header-search-toggle a,
.header-transparent.elementor-sticky--active.elementor-sticky--effects #toggleMobileMenu,
.header-transparent.elementor-sticky--active.elementor-sticky--effects .elementor-nav-menu li a {
	background-color: transparent;
	color: #FF834F !important;
	border: 1px solid #FF834F;
}
/* Header on Start Page - END */



/* --- FAQ Accordion (Elementor style) --- */

.kfv-faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Individual accordion item */
.kfv-faq-item {
    border: none;
    background: #ffffff;
    border-radius: 4px;
    overflow: hidden;
    transition: background 0.3s ease;
}

.kfv-faq-item[open] {
    background: #ffffff;
}

/* Summary/Header */
.kfv-faq-item summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
    font-weight: 600;
    padding: 1rem 1.25rem;
    list-style: none;
    user-select: none;
}

/* Remove default marker */
.kfv-faq-item summary::-webkit-details-marker,
.kfv-faq-item summary::marker {
    display: none;
}

/* Focus state for accessibility */
.kfv-faq-item summary:focus {
    outline: 2px solid #ff7b38;
    outline-offset: -2px;
}

.kfv-faq-item summary:focus:not(:focus-visible) {
    outline: none;
}

/* Title header */
.e-n-accordion-item-title-header {
    flex: 1;
}

.e-n-accordion-item-title-text {
    display: block;
}

/* Icon container */
.e-n-accordion-item-title-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #ff7b38;
    color: #fff;
    font-size: 14px;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.e-n-accordion-item-title-icon i.icon {
	font-size: 24px;
	vertical-align: middle;
}

/* Icon state management */
.e-n-accordion-item-title-icon .e-opened {
    display: none;
}

.e-n-accordion-item-title-icon .e-closed {
    display: inline;
}

.kfv-faq-item[open] .e-n-accordion-item-title-icon .e-opened {
    display: inline;
}

.kfv-faq-item[open] .e-n-accordion-item-title-icon .e-closed {
    display: none;
}

/* Optional: rotate icon instead of swapping */
.kfv-faq-item[open] .e-n-accordion-item-title-icon {
    transform: rotate(180deg);
}

/* Content panel - SMOOTH ANIMATION */
.kfv-faq-content {
    height: 0;
    overflow: hidden;
    padding: 0 1.25rem;
    transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                padding 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.kfv-faq-item[open] .kfv-faq-content {
    padding: 0 1.25rem 1rem;
}

/* Answer content */
.kfv-faq-answer {
    padding-top: 0.5rem;
	width: 100%;
}

@media only screen and (min-width: 429px) {
  .kfv-faq-answer {
	width: 80%;
}
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
    .kfv-faq-content,
    .e-n-accordion-item-title-icon,
    .kfv-faq-item {
        transition: none;
    }
}

/* --- End FAQ Accordion --- */



/* Adjust Elementor anchor scroll offset */
.elementor-menu-anchor {
    position: relative;
    top: -80px;          /* header height */
    margin-bottom: -80px;
    visibility: hidden; /* anchor stays invisible */
}



/* Contact Form 7 - START */
.contact-form-module .cf7-grid-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0px 60px;
}

.contact-form-module .cf7-grid-wrapper p {
  margin: 0 0 24px 0;
}

.contact-form-module .cf7-grid-wrapper h3 {
  grid-column: span 1;
  font-size: 20px;
  font-weight: 700;
  color: #004899;
  margin: 0 0 10px 0;
  line-height: 1.3;
}

.contact-form-module .cf7-grid-wrapper h3:first-of-type {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
}

.contact-form-module .cf7-grid-wrapper h3:nth-of-type(2) {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
}

.contact-form-module .cf7-grid-wrapper label {
  display: block;
  font-size: 13px;
  font-weight: 400;
  color: var(--secondary-text);
  margin-bottom: 6px;
}

.contact-form-module .wpcf7-form-control {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #BAC5CD;
  border-radius: 8px;
  background-color: #FFFFFF;
  font-size: 16px;
  line-height: 1.5;
  color: var(--secondary-text);
  transition: border-color 0.3s ease;
}

.contact-form-module .wpcf7-form-control:focus {
  outline: 1px solid #FF834F; 
  border: 1px solid #FF834F;
}

.contact-form-module textarea.wpcf7-form-control {
  height: 326px;
  resize: vertical;
}

.contact-form-module .wpcf7-form-control-wrap[data-name*='file'] > span {
  display: block;
}

.contact-form-module .wpcf7-file {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.contact-form-module .cf7-column-2 .file-upload-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 140px;
  padding: 27px 16px;
  text-align: center;
  border-radius: 8px;
  border: 1px dashed var(--border);
  background-color: var(--white);
  cursor: pointer;
}

.contact-form-module .wpcf7-file + label.file-upload-label {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 120px;
  border: 2px dashed var(--border);
  border-radius: 4px;
  padding: 20px;
  cursor: pointer;
  text-align: center;
  transition: border-color 0.3s ease, background-color 0.3s ease;
  background-color: var(--white);
}

.contact-form-module .wpcf7-file + label.file-upload-label:hover {
  border-color: var(--accent-base);
}

.contact-form-module .file-upload-label .upload-icon {
  width: 40px;
  height: 40px;
  margin-bottom: 8px;
  display: inline-block;
  background-image: url('../img/folder-upload.svg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

.contact-form-module .file-upload-label .upload-text {
  font-size: 16px;
  color: var(--grey-text);
  line-height: 24px;
  font-weight: 400;
}
.contact-form-module .file-upload-label .upload-subtext {
  font-size: 13px;
  color: var(--grey-text);
  line-height: 19px;
  font-weight: 400;
}

.contact-form-module .wpcf7-form-control-wrap[data-name*='file'] + p {
  font-size: 12px;
  color: var(--grey-text);
  margin-top: 8px;
  text-align: center;
}

.contact-form-module .wpcf7-form .form-footer {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between; /* left text + right button */
  align-items: flex-end;
  flex-wrap: wrap; /* ensures responsive stacking on smaller screens */
  gap: 20px;
  margin-top: 20px;
}

.contact-form-module .wpcf7-form .form-footer .cf7-column-1 {
  flex: 1 1 60%;
	max-width: 50%;
}

.contact-form-module .wpcf7-form .form-footer .cf7-column-2 {
  flex: 0 0 auto;
}

.contact-form-module .contact-form-privacy {
  font-size: 13px;
  color: var(--grey-text);
  line-height: 1.5;
  max-width: 600px;
  text-align: left;
  width: 100%;
}

.contact-form-module .contact-form-privacy a {
  color: var(--accent-base);
  text-decoration: underline;
}

.contact-form-module .wpcf7-submit {
  background-color: var(--accent-base);
  color: var(--white);
  border: 1px solid #FF834F;
  padding: 14px 30px;
  border-radius: 8px;
  cursor: pointer;
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  transition: background-color 0.3s ease;
}

.contact-form-module .wpcf7-submit:hover {
	background-color: #ffffff;
    color: #FF834F;
	border: 1px solid #FF834F;
}

/* CF7 Response Output Messages - START */
.contact-form-module .wpcf7-response-output {
  grid-column: 1 / -1;
  margin: 20px 0 0 0;
  padding: 15px;
  border-radius: 4px;
  text-align: center;
}

.wpcf7-not-valid-tip {
  color: var(--warning);
  font-size: 13px;
  font-weight: 400;
  margin-top: 5px;
  display: block;
}

.wpcf7 form.invalid .wpcf7-response-output {
  padding: 8px;
  background-color: var(--warning) !important;
  color: var(--white) !important;
  font-size: 14px !important;
  border: none !important;
}

.wpcf7-spinner {
  display: none !important;
  visibility: hidden !important;
}
/* CF7 Response Output Messages - END */

/* Contact Form 7 - Mobile Stacking - START */
@media (max-width: 600px) {
  /* 2 columns -> 1 column */
  .contact-form-module .cf7-grid-wrapper {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  /* Headings & columns span full width in the 1-column grid */
  .contact-form-module .cf7-grid-wrapper h3,
  .contact-form-module .cf7-column-1,
  .contact-form-module .cf7-column-2 {
    grid-column: 1 / -1;
  }
	
	.contact-form-module .wpcf7-form .form-footer .cf7-column-1 {
		max-width: 100%;
		margin-top: -40px;
	}
}
/* Contact Form 7 - Mobile Stacking - END */
/* Contact Form 7 - END */




.news-hero-full img.hero-image {
  width: 100%;
  height: auto;
  display: block;
}



/* Leistung Child - Steps - When exactly 4 items -> force 2x2 layout */
.leistung-steps.leistung-steps--four-items .elementor-grid-3 .elementor-grid {
    grid-template-columns: repeat(2, 1fr);
}



/* CookieFirst - START */
/* Page Cookie-Einstellungen - START */
.cookiefirst-cookie-declaration p:nth-last-of-type(3) {
  padding: 1em !important;
}

.cookiefirst-cookie-declaration h2:nth-of-type(4) {
  margin-bottom: 0.5em;
}

.cookiefirst-cookie-declaration h2:nth-of-type(1) {
  margin-top: 2.25em !important;
  margin-bottom: 0.5em !important;
}

.cookiefirst-cookie-declaration .cf1tXD {
  margin-top: 1.5em;
}

.cookiefirst-cookie-declaration h3 {
    margin-top: 1.5em;
}

.cookiefirst-cookie-declaration h4 {
    margin-top: 1.5em;
}

.cookiefirst-cookie-declaration button {
    margin-top: 1em;
	margin-bottom: 1em;
	margin-right: 1em;
}

.cookiefirst-cookie-declaration button {
    border: 1px solid #FF834F;
	font-size: 14px;
}

.cookiefirst-cookie-declaration button:hover,
.cookiefirst-cookie-declaration button:focus {
	background-color: #FFFFFF;
	color: #FF834F;
	border: 1px solid #FF834F;
}

/* Table scroll on small devices */
.cookiefirst-cookie-declaration .cf1Hdl {
	overflow-y: scroll;
}


.cookiefirst-cookie-declaration .cf1tXD .cfMKVG {
	left: auto;
	right: 10px;
}
/* Page Cookie-Einstellungen - END */

/* Cookie Banner (everywhere) - Main Banner - START */
.cookiefirst-root [data-cookiefirst-widget="banner"] {
	border-left: 16px solid #FF834F;
}

.cookiefirst-root [data-cookiefirst-widget="banner"] .cf3dLT {
  max-width: 40px;
}
/* Cookie Banner (everywhere) - Main Banner - END */

/* Cookie Banner (everywhere) - Einstellung anpassen - START */
.cookiefirst-root [data-cookiefirst-widget="modal"] .cfttQk.cfSE2t.cfUZKH {
  flex: 0 0 16.66666667%;
  max-width: 16.66666667%;
}

.cookiefirst-root [data-cookiefirst-widget="modal"] .cf3dLT {
  max-height: 20px;
  margin-left: auto;
}
/* Cookie Banner (everywhere) - Einstellung anpassen - END */

.cookiefirst-root .cf1lHZ button:not([data-cookiefirst-action="accept"]) {
  background-color: #EFF3F7 !important;
  color: #2c2c2c !important;
  border: 1px solid #d8d8d8 !important;
}
.cookiefirst-root .cf1lHZ button:not([data-cookiefirst-action="accept"]):hover {
  background-color: #FFFFFF !important;
  color: #FF834F !important;
  border: 1px solid #FF834F !important;
}

@media only screen and (min-width: 1552px) {
	div[data-cookiefirst-widget="banner"] {
		width: 1440px;
	}
}

.cfKpv2 {
	max-width: 550px !important;
}
/* CookieFirst - END */



.kfv-fokusthema-leistungen > *:nth-child(even) .kfv-leistung-group {
    background: #f2f4f7;
}



.mega-menu-popup button[aria-selected="true"]::before {
	content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;              /* makes it auto-match element height */
    width: 5px;
    background: var(--e-global-color-accent);
    border-radius: 0;
}


#toggleMobileMenu i.icon-close {
	font-size: 30px;
}

.mm-panel {display:none}
.mm-panel.is-active {display:block}


.menu-leistungen-link a i.icon-chevron-bottom-normal,
.menu-link-bg a i.icon-chevron-bottom-normal,
.menu-link-kp a i.icon-chevron-bottom-normal,
.menu-link-svu a i.icon-chevron-bottom-normal,
.menu-link-va a i.icon-chevron-bottom-normal,
.menu-link-sf a i.icon-chevron-bottom-normal {
    display: inline-block;
    transform: rotate(-90deg);
    margin-left: 8px;
}



/* KFV Search - START */
@media (max-width: 576px) {
	.search-results main,
	.search-no-results main {
		padding-inline-start: 20px !important;
		padding-inline-end: 20px !important;
		max-width: inherit !important;
	}
}

.kfv-search-hero {
    width: 100%;
    padding: 80px 0 40px;
}

.kfv-search-title {
    font-family: 'Cabin', sans-serif;
    font-size: 48px !important;
    line-height: 1.2;
    font-weight: 700;
    color: var(--e-global-color-text);
    margin: 0 0 15px;
}

.kfv-search-title span {
    position: relative;
    padding-bottom: 8px;
}

.kfv-search-title span::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 6px;
    background-color: var(--e-global-color-accent);
}

@media (max-width: 768px) {
    .kfv-search-title {
        font-size: 36px;
    }
}

.kfv-search-subtitle {
    font-family: 'Cabin', sans-serif;
    font-size: 18px;
    color: #444;
    margin: 0;
}

.kfv-search-type {
    display: inline-block;
    margin-bottom: 6px;
    padding: 2px 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Cabin', sans-serif;
    letter-spacing: 0.03em;
    color: #004899;
    background: var(--e-global-color-036af71);
}

/* Optional: different colors per type */
.kfv-search-type--page {
/*     background: #ff7a3c; */
	background: var(--e-global-color-036af71);
}

.kfv-search-type--fokusthema {
/*     background: #004b99; */
	background: var(--e-global-color-036af71);
}

.kfv-search-type--leistung {
/*     background: #00a89d; */
	background: var(--e-global-color-036af71);
}

.zebra-search-results {
	height: 96px;
	margin-bottom: 40px;
}

.search-results .entry-title:hover,
.search-results .entry-title:focus {
	text-decoration: underline;
	text-decoration-color: var(--e-global-color-accent);
}
/* KFV Search - END */