/*
Theme Name: Porto Child
Theme URI: https://www.portotheme.com/wordpress/porto
Author: P-THEMES
Author URI: https://www.portotheme.com/
Description: Porto Responsive WordPress + eCommerce Theme.
Version: 1.1
Template: porto
License: Commercial
License URI: http://themeforest.net/licenses/regular_extended
Tags: woocommerce, corporate, ecommerce, responsive, blue, black, green, white, light, dark, red, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
*/

/*************** ADD YOUR CUSTOM CSS HERE  ***************/

/* Allgemeine Styles */

.main-content {
    padding-top: 0px !important;
	padding-bottom: 0px !important;
}

h1{
	text-transform: uppercase !important;
	margin: 25px 0 !important;
}

h2{
	margin-bottom: 20px !important;
}

.bold{
	font-weight: 700;	
}

ol li{
	padding: 0 0 15px 0 !important;
}

/* Header und Navigation immer in oberster Ebene (z-index) */
#header,
.header-wrapper,
.sticky-header,
#main-menu {
  z-index: 9999 !important;
  position: relative;
}

@media (max-width: 767px) {
  .post-image,
  .featured-image {
    position: relative;
    z-index: 1;
  }

  .mobile-menu,
  .mobile-menu-overlay,
  #header,
  .header-wrapper,
  .sticky-header {
    position: relative;
    z-index: 9999 !important;
  }
}


/* Header-Builder - Unterscheidung Desktop oder Mobile */

/* Standardzustand */
.only-desktop {
  display: block;
}
.only-mobile {
  display: none;
}

/* Safari-Fix für mobile/Desktop-Wechsel */
@media (max-width: 767px) {
  .only-desktop {
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    z-index: -1 !important;
  }
  .only-mobile {
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
  }
}

@media (min-width: 768px) {
  .only-mobile {
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    z-index: -1 !important;
  }
  .only-desktop {
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
  }
}



/* Logo und Suchfeld-Abstände */
.vc_custom_1740136850096 {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}
.vc_custom_1747755992844 {
  padding-top: 40px !important;
}
.vc_custom_1747754612979 {
  padding-left: 5% !important;
}






/* Mega-Menü Styling */

#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row .mega-menu-column > ul.mega-sub-menu > li.mega-menu-item {
    padding: 0 !important;
    width: 100%;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu input, #mega-menu-wrap-main_menu #mega-menu-main_menu img {
    border: none !important;
}

@media only screen and (min-width: 769px) {
    #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-columns-3-of-12 {
        width: 25%;
        padding-right: 5% !important;
    }
}

#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row .mega-menu-column > ul.mega-sub-menu > li.mega-menu-item {
    text-align: center !important;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row .mega-menu-column > ul.mega-sub-menu > li.mega-menu-item .kastenhover:hover {
    background: #33b8c6 !important;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column-standard li.mega-menu-item > a.mega-menu-link, #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item > a.mega-menu-link {
    color: #fff;
    font-size: 18px;
    text-transform: none;
    text-decoration: none;
    font-weight: normal;
    text-align: left;
    margin: 0px 0px 15px 0px;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column-standard > a.mega-menu-link, #mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    color: #222;
    font-size: 18px;
    padding: 10px;
    border: 0;
}

/* Abstand zwischen 2 Spalten (=column gap) auf 0px festlegen */
.row.vc_column-gap-1 {
    --bs-gutter-x: 0px !important;
}

/* Header Styling */
#header .share-links {
	text-align: right !important;
	padding-right: 18% !important;
}

/* Breadcrumb-Styling */

.breadcrumb {
    margin-bottom: 0 !important;
}

.page-top ul.breadcrumb{
	background: #3fb7b8 !important;
	padding: 10px 20px !important;
	border: 1px solid #3fb7b8 !important;
	border-radius: 10px !important;
	color: #fff !important;
	font-size: 16px !important;
}

.page-top .yoast-breadcrumbs, .page-top .breadcrumbs-wrap {
    background: transparent !important;
	margin-top: 40px !important;
}

.page-top {
    background-image: url('https://www.kameleon-design.de/kliniken-nea/wp-content/uploads/2025/04/klinikfinder_hintergrund_neu.jpg') !important;
	background-size: cover !important;
}

/* Design Hauptnavi-Buttons */
.notfall{
	background-color: #b70000 !important;
	padding: 5px 10px !important;
	border: 1px solid #b70000 !important;
	border-radius: 10px !important;
	
}

.notfall a{
	color: #fff !important;
}

/* Design Menüpunkt "Funktionsbereiche */

.funktionsbereiche{
	border-top : 1px solid #fff !important;
	padding-top: 10px;
	margin-top: 30px !important;
} 

.funktionsbereiche a{
	margin-top: 20px !important;
}

/* Design Akkordeon-Element "Leistungen" */

.vc_tta.vc_general .vc_tta-panel-title>a {
    background: #fff !important;
    color: inherit;
    border: 1px solid #ccc !important;
	border-radius: 10px !important;
    box-shadow: 1px 10px 5px rgba(204, 204, 204, 0.9) !important;
}

.vc_tta-color-white.vc_tta-style-flat .vc_tta-panel.vc_active .vc_tta-panel-title>a {
    background: #2baab1 !important;
	color: #fff !important;
	border: 1px 1px 0px 1px solid #ccc !important;
	border-radius: 10px 10px 0 0 !important;
    box-shadow: none !important;
}

.vc_tta.vc_tta-accordion .vc_tta-controls-icon-position-right.vc_tta-panel-title>a {
    padding: 30px 42px 30px 42px !important;
}

.vc_tta-shape-rounded.vc_tta-o-shape-group:not(.vc_tta-o-no-fill) .vc_tta-panel:first-child:not(:last-child) .vc_tta-panel-body,
.vc_tta-shape-rounded.vc_tta-o-shape-group:not(.vc_tta-o-no-fill) .vc_tta-panel:not(:first-child):not(:last-child) .vc_tta-panel-body,
.vc_tta-shape-rounded.vc_tta-o-shape-group:not(.vc_tta-o-no-fill) .vc_tta-panel:last-child:not(:first-child) .vc_tta-panel-body{
	
	background: #fff !important;
    color: inherit;
    border: 0px 1px 1px 1px solid #ccc !important;
	border-radius: 0 0 10px 10px !important;
    box-shadow: 1px 10px 5px rgba(204, 204, 204, 0.9) !important;
	padding: 5% !important;
	
}

/* Beitrags-Gitter für Blogbeiträge - nur Headline anzeigen ohne Excerpt
.vc_gitem-post-data-source-post_excerpt {
    display: none !important;
	visibility: hidden !important;
}*/

.blogbeitrag{
	border: 1px solid #597fb0;
	border-radius: 10px;
	padding: 0;
	box-shadow: 3px 8px 5px rgba(0,0,0,0.2);
	transition: transform 0.3s ease;
  	transform-origin: center center;
 	 display: block;
}

.blogbeitrag:hover {
  transform: scale(1.03);
  z-index: 2;
  position: relative;
}

.blogbeitrag img{
	border-radius: 10px 10px 0 0;
}

/* Blogbeiträge "Pressemitteilungen"  */

	/* Button nur auf Seite 3800 (Aktuelles und Presse) grau einfärben */
.page-id-3800 .vc_btn3.vc_btn3-color-juicy-pink, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
    background-color: #3fb7b8 !important; /* tuerkis */
    color: #fff !important;
}

.page-id-3800 h4{
	font-weight: 900;
}

/* Pressemitteilungen Grid - Pagination-Button */
.rt-pagination .pagination-list>.active>a, .rt-pagination .pagination-list>.active>a:focus, .rt-pagination .pagination-list>.active>a:hover, .rt-pagination .pagination-list>.active>span, .rt-pagination .pagination-list>.active>span:focus, .rt-pagination .pagination-list>.active>span:hover {
    background-color: #597fb0 !important;
    border-color: #597fb0 !important;
}



/* Design Mitarbeiter-Visitenkarte - Formatierung in functions.php im Child-Theme */

.mitarbeiter-visitenkarte {
    display: flex;
    flex-wrap: nowrap;
    border: 1px solid #ccc;
	border-radius: 0px;
    box-shadow: 0px 15px 5px rgba(0,0,0,0.2);
    padding: 20px;
    margin-bottom: 20px;
    max-width: 600px;
    width: 100%;
    box-sizing: border-box;
    gap: 20px;
    background: #fff;
}

.mitarbeiter-foto {
    width: 200px;
    flex-shrink: 0;
}

.mitarbeiter-foto img {
    display: block;
    max-width: 100%;
    height: auto;
}

.mitarbeiter-details {
    flex-grow: 1;
}

.mitarbeiter-details p {
    margin: 0 0 5px;
}

/* Design Inhaltsboxen (WPBakery-Elemente) mit Boxschatten */

.schattenbox{
	box-shadow: 3px 8px 5px rgba(0,0,0,0.2);
}

/* Smartphone-Ansicht */
@media (max-width: 768px) {
    .mitarbeiter-visitenkarte {
        flex-direction: column !important;
    }

    .mitarbeiter-foto {
        width: 100% !important;
        margin-right: 0 !important;
    }

    .mitarbeiter-details {
        width: 100% !important;
    }
}



/* Startseite Elemente */
/* Kliniken Vorschaubilder */

.thumb-info .thumb-info-title {
    background: rgba(91, 128,181, 0.8) !important;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0 !important;
    padding: 8px 41px 8px 21px;
	width: 100% !important;
}
/* Klinikwegweiser-Kacheln*/

.klinikwegweiser{
	text-align: center !important; 
	color: #fff !important; 
	font-size: 22px !important;
}

/* Standardbutton Farbe türkis */
.vc_btn3.vc_btn3-color-turquoise.vc_btn3-style-modern {
    background-color: #3fb7b8 !important;
    border-color: #3fb7b8 !important;
    color: #fff;
}


/* Kontaktformular Patientenzufriedenheit */

/* Abstand zwischen Formularzeilen */
.wpcf7 p {
  margin-bottom: 3px !important; /* engerer Abstand zwischen Zeilen */
}

/* Labels */
.wpcf7 label {
  display: block;
  margin: 18px 0 0 0 !important; /* Abstand über Feld */
  font-weight: bold;
  font-size: 16px; /* Schriftgröße unverändert */
}

/* Alle Textfelder, Dropdowns und Textareas gleich breit und kompakt */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100% !important;  /* volle Breite des Containers */
  max-width: 100% !important;
  padding: 0 !important; /* kompakte Höhe */
  margin: -20px 0 20px 0 !important;
  font-size: 16px;
  height: 34px !important; /* feste Höhe für Inputs und Selects */
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 4px;
}

/* Textareas etwas höher als Inputs */
.wpcf7 textarea {
  height: 80px !important; /* kompakte Höhe */
  resize: vertical;
}

/* Radiobuttons nebeneinander */
.wpcf7 input[type="radio"] {
  display: inline-block;
  width: auto;
  margin-right: 10px !important;
}

/* Checkbox (Datenschutz) kompakt */
.wpcf7 input[type="checkbox"] {
  width: auto;
  margin-right: 8px;
  margin-top: -20px !important;
}

/* Submit-Button */
.wpcf7 input[type="submit"] {
  padding: 6px 12px !important;
  font-size: 16px;
  width: 100%;
  border-radius: 4px;
  cursor: pointer;
}

/* Radio- und Checkbox-Gruppen */
.wpcf7 .wpcf7-list-item {
  margin-right: 15px; /* Abstand zwischen Optionen */
}


/* --- Robustes Fix-CSS für verschwundene Labels --- */

/* 1) Labels sicher anzeigen, fett und oben */
.kliniken-formular strong,
.kliniken-formular label,
.wpcf7-form .kliniken-formular strong,
.wpcf7-form .kliniken-formular label {
  display: block !important;
  font-weight: 700 !important;
  margin: 0 0 6px 0 !important;      /* Abstand Label -> Feld */
  color: #777 !important;            /* Textfarbe sicherstellen */
  position: relative !important;
  z-index: 9999 !important;          /* Label ganz vorne */ 
  line-height: 1.2 !important;
}

/* 2) Inputs/Textareas/Selects: volle Breite, oben-nach-unten Layout */
.kliniken-formular .full-width-field,
.kliniken-formular input[type="text"],
.kliniken-formular input[type="email"],
.kliniken-formular input[type="tel"],
.kliniken-formular input[type="date"],
.kliniken-formular textarea,
.kliniken-formular select {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: block !important;
  position: relative !important;     /* verhindert absolute Überlagerung */
  margin: 0 0 14px 0 !important;     /* Abstand Feld -> nächstes Label */
  padding: 8px 10px !important;
  z-index: 1 !important;             /* Input hinter dem Label */
}

/* 3) Falls Inputs absolut positioniert werden: neutralisieren */
.kliniken-formular input,
.kliniken-formular textarea,
.kliniken-formular select {
  top: auto !important;
  left: auto !important;
  transform: none !important;
}

/* 4) Radio/Checkbox-Gruppen: inline, aber Abstand nach unten */
.kliniken-formular .wpcf7-list-item,
.kliniken-formular .wpcf7-checkbox,
.kliniken-formular .wpcf7-radio {
  display: inline-block !important;
  margin-right: 12px !important;
}
.kliniken-formular .wpcf7-radio,
.kliniken-formular .wpcf7-checkbox {
  margin-bottom: 12px !important;
}

/* 5) Extra-Schutz: falls Theme Labels unsichtbar macht */
.kliniken-formular label[for],
.kliniken-formular strong {
  visibility: visible !important;
  opacity: 1 !important;
}

/* 6) Submit-Button volle Breite */
.kliniken-formular input[type="submit"],
.kliniken-formular button[type="submit"] {
  width: 100% !important;
  display: block !important;
}