/*
Theme Name:   Gemeinschaftspraxis Dr. Jovic-Paris & Dr. med. Gardlo
Theme URL:        https://tobias-waldenmaier.de/
Description:  Child-Theme für die Internetseite der Gemeinschaftspraxis Dr. Jovic-Paris & Dr. med. Gardlo Bad Neuenahr-Ahrweiler.
Author:           Tobias Waldenmaier
Author URL:   https://tobias-waldenmaier.de
Template:         generatepress
Version:          1.0.0
License:          GNU General Public License v2 or later
License URL:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  generatepress
*/



/* ---------  GLOBALE EINSTELLUNGEN --------- */

blockquote {
    border-left: 5px solid rgba(0, 0, 0, .05);
    padding: 20px;
    font-size: 0.8em;
    font-style: italic;
    margin: 0 0 1.5em;
    position: relative;
}

.dotted-underline,
.dotted-underline a {
  text-decoration: none !important;  /* normale Unterstreichung ausschalten */
  border-bottom: 2px dotted currentColor; /* gepunktete Linie */
  display: inline;  /* sicherstellen, dass es nur das Wort betrifft */
}

b, strong {
    font-weight: 520 !important;
}

li {
    margin-bottom: 15px !important;
}

.abstand-praxisseite {
    margin-top: 15px !important;
}

@media (max-width: 767px) {
    .abstand-praxisseite {
        margin-top: 0;
    }
}

.wp-block-separator,
hr {
  border: none;
  height: auto;           /* Höhe automatisch, da Text verwendet wird */
  margin: 2rem 0;
  text-align: left;
  font-size: 15px;        /* Größe der Striche */
  line-height: 1;         
  color: #C8A46D;
  background: none !important;
}

.wp-block-separator::before,
hr::before {
  content: "//////////////////////////////////////////"; /* Anzahl anpassen */
  display: block;
}




.wp-block-button[class*="is-style-outline"] .wp-block-button__link {
  border-color: #C8A46D; 
  border: 2px dotted #C8A46D;
  height: 70px;
}


/* ---------  HOEHE MENUE-LEISTE --------- */
.inside-header {
    padding: 5px 40px;
}

/* ---------  ABSTAND MENUELEISTE ZU HEADER UND CONTENT --------- */

.nav-below-header .main-navigation .inside-navigation.grid-container, 
.nav-above-header .main-navigation .inside-navigation.grid-container {
    margin-top: 10px;
    margin-bottom: -10px;
}

.site-header {
    background-color: var(--base-3);
    margin-top: 30px;
	position: sticky;         
	top: 0;                   
	z-index: 1000;            
	background: rgba(255, 255, 255, 0.65); /* Transparenz */
	backdrop-filter: blur(6px); /* Glas-Effekt */
	transition: background 0.3s ease;
}

/* ---------  HINTERGRUNDFARBE CONTENT-BEREICH --------- */
.separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .one-container .container, .separate-containers .paging-navigation, .inside-page-header {
    background: rgba(255, 255, 255, 0.65); /* weiss mit leichter Transparenz */
}

/* -----------------------------------------
  HINTERGRUNDBILD
------------------------------------------ */

.page-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 90vh;
  
  /* Fallback-Hintergrundbild wenn kein Inline-Image gesetzt ist */
  background-image: url('/wp-content/uploads/2025/10/amanda-dalbjorn-fvInY-Gh7sc-unsplash.jpg');

  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
  z-index: -1; /* hinter Header + Content */
}

/* Falls ein Custom-Bild per inline-style gesetzt wurde,
   überschreibt es automatisch den Fallback.
   (kein CSS nötig dafür)
*/

/* -------------------------------
   1) Weißliche Überlagerung
-------------------------------- */
.page-hero-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(235,225,215,0.7); /* 70% Weiß/Beige wie vorher */
  pointer-events: none;
}

/* -------------------------------
   2) Verlauf in Body-Hintergrund
-------------------------------- */
.page-hero-bg::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 300px; 
  background: linear-gradient(
    to bottom,
    rgba(235,225,215,0) 0%,
    var(--base-2) 100%
  );
  pointer-events: none;
}


/* Body-Hintergrundfarbe als Fallback */
body {
  background-color: var(--base-2);
}


/* ---------  SCHRIFTGROESSE HAUPTMENU --------- */
.main-navigation .main-nav ul li a {
    font-size: 18px;
}


/* ---------  SPAN HIGHLIGHT TEXT START --------- */
.highlight {
    font-weight: 500; 
}

.site-info a {
  display: inline-block;
  margin: 0 0.35rem;
  padding: 0;
  font-weight: 500;
  text-decoration: none;
  transition: text-decoration .15s ease, opacity .15s ease;
}

.site-info a:hover,
.site-info a:focus {
  text-decoration: underline;
  opacity: 0.95;
  outline: none;
}

@media (max-width: 480px) {
  .site-info {
    padding: 16px 10px;
    font-size: 13px;
  }
}
/* ---------  DOCTOLIB -------- */
/* Positionierung rechts am Rand */
.doctolib-overlay {
    position: fixed;
    top: 30%;
    right: 0;
    transform: translateY(-50%);
    z-index: 9999;
    font-family: sans-serif;
}

/* Container im Doctolib-Stil */
.doctolib-box {
    background: rgba(16, 122, 202, 0.6); /* leichte Transparenz */
    backdrop-filter: blur(10px) saturate(180%);
    -webkit-backdrop-filter: blur(10px) saturate(180%);
    border-radius: 12px 0 0 12px;
    padding: 10px 14px;
    width: 120px;
    text-align: center;

    border: 1px solid rgba(255, 255, 255, 0.25); /* zarter Rand */
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);     /* weicher Glas-Schatten */
}


/* Logo */
.doctolib-logo {
    color: white;
    font-size: 20px;
    margin-bottom: 6px;
    font-weight: 600;
}

/* Buttons */
.doctolib-btn {
    display: block;
    background: #fff;
    color: #1e3d59;
    text-decoration: none;
    padding: 6px 0;
    margin: 4px 0;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    transition: background 0.2s;
}

.doctolib-btn:hover {
    background: #e6e6e6;
}


@media (max-width: 768px) {
    .doctolib-overlay {
        display: none !important;
    }
}

/* ---------  BOXEN AUF LEISTUNGSSEITE --------- */

.wp-block-preformatted {
  border: 2px dotted #C8A46D;
  border-radius: 8px;
  padding: 1em;
  background-color: #FFFFFF !important;
  margin-bottom: -10px;
}

/* ---------  FOOTER WELLE --------- */
.footer-wave {
    width: 100%;
    overflow: hidden;
    line-height: 0;
    margin-top: 30px;
}

.footer-wave svg {
    display: block;
    width: 100%;
    height: 100px; 
}

@media (max-width: 768px) {
    .footer-wave svg {
        height: 60px; 
    }
}

.wp-block-table td, .wp-block-table th {
    border: 0.1px solid;
	border-color: #C8A46D;
    padding: .2em;
}

.footer-widgets {    
    background-color: #C8A46D;
}

.site-info {   
    background-color: #C8A46D;
}

/* ---------  Dashboard Infobox --------- */

.infobox {
    background: #f9f9f9;
    border-left: 4px solid #C8A46D;
    padding: 16px;
	margin-bottom: 20px;
	margin-top: 20px;
}

.infobox-title {
    font-weight: 600;
    margin-bottom: 8px;
    color: #C8A46D;
}

.infobox-content {
    color: #333;
	margin-bottom: -20px;
}