/*
Theme Name: Schmerzpunkt Theme
Theme URI: https://www.schmerzpunkt-therapie.at
Author: Bünyamin Donbay
Author URI: https://www.schmerzpunkt-therapie.at
Description: Ein barrierefreies (erişilebilir) WordPress Theme für die Heilmassagepraxis Schmerzpunkt. Entwickelt von Sareldo Design Works.
Version: 1.0.6
Text Domain: schmerzpunkt-theme
*/

/* --- GOOGLE FONTS --- */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&display=swap');

/* Ekran Okuyucular (Screen Reader) İçin Gizli Metin Sınıfı */
.screen-reader-text {
    border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
    height: 1px; margin: -1px; overflow: hidden; padding: 0;
    position: absolute !important; width: 1px; word-wrap: normal !important;
}

/* ==========================================================================
   1. Renk Değişkenleri
   ========================================================================== */
:root {
    --color-bg-main: #FAF9F6;      
    --color-text: #4A4A4A;         
    --color-heading: #2C2C2C;      
    --color-section-bg: #F2F2F2;   
    --color-accent: #3A5F45;       
    --color-accent-hover: #26402E; 
    --color-divider: #E5E5E5;      
    --color-white: #FFFFFF;
}

/* ==========================================================================
   2. Temel Tipografi ve Görünüm
   ========================================================================== */
body {
    background-color: var(--color-bg-main); color: var(--color-text);
    font-family: 'Montserrat', sans-serif; line-height: 1.7; margin: 0; padding: 0; font-size: 16px; overflow-x: hidden; 
}

h1, h2, h3, h4, h5, h6 { color: var(--color-heading); font-family: 'Playfair Display', serif; margin-top: 0; font-weight: 600; line-height: 1.3; }

/* ==========================================================================
   3. Linkler ve Butonlar
   ========================================================================== */
a { color: var(--color-accent); text-decoration: underline; text-underline-offset: 4px; transition: all 0.3s ease; }
a:hover, a:focus { color: var(--color-accent-hover); }

.button, button, input[type="submit"], .header-cta {
    background-color: var(--color-accent); color: var(--color-white); border: none; padding: 12px 28px !important; font-size: 0.9rem;
    font-family: 'Montserrat', sans-serif; font-weight: 500; letter-spacing: 0.5px; text-transform: uppercase; border-radius: 4px; 
    cursor: pointer; text-decoration: none !important; display: inline-block !important; transition: background-color 0.3s ease;
    white-space: nowrap !important; /* Buton yazısının iki satıra düşmesini engeller */
}
.button:hover, button:hover, input[type="submit"]:hover, .header-cta:hover { background-color: var(--color-accent-hover); color: var(--color-white); }

/* ==========================================================================
   4. Temel İskelet Düzeni (Layout)
   ========================================================================== */
.site-main { padding: 60px 5%; max-width: 1000px; margin: 0 auto; }
hr { border: 0; border-top: 1px solid var(--color-divider); margin: 40px 0; }

/* ==========================================================================
   5. HEADER - KESİN ÇÖZÜM (TAM GENİŞLİK VE TEK SATIR KİLİDİ)
   ========================================================================== */
.site-header {
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-divider);
    width: 100% !important;
    display: block !important;
    position: relative;
    z-index: 1000;
}

.header-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important; /* Ortada toplanmayı engeller, tam ekran yapar */
    padding: 20px 3% !important; /* Sadece %3 kenar boşluğu bırakıp duvarlara yaslar */
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* 1. LOGO: EN SOL DUVARA ÇİVİLİ */
.site-logo {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    flex: 0 0 auto !important; 
    margin-right: auto !important; /* Sağındaki her şeyi uzağa iter */
    text-decoration: none !important;
}

.site-logo img {
    max-width: 350px !important;
    height: auto !important;
    display: block !important;
}

.site-slogan {
    font-family: 'Montserrat', sans-serif; font-size: 0.90rem; font-weight: 500; 
    letter-spacing: 1px; color: var(--color-text); text-transform: uppercase; 
    margin-top: 5px; white-space: nowrap !important; 
}

/* 2. MENÜ VE BUTON ANA GRUBU: EN SAĞ DUVARA ÇİVİLİ */
.main-navigation {
    display: flex !important;
    flex: 1 1 auto !important;
    justify-content: flex-end !important; 
    align-items: center !important;
    min-width: 0 !important;
}

.menu-wrapper {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 40px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
}

/* MENÜ LİNKLERİ KİLİDİ */
.primary-menu-container ul {
    display: flex !important;
    flex-direction: row !important;
    gap: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    list-style: none !important;
}

.primary-menu-container ul li {
    position: relative !important;
}

.primary-menu-container ul li a {
    white-space: nowrap !important; /* Yazıların iki satır olmasını KESİNLİKLE engeller */
    display: block !important;
    text-decoration: none !important; color: var(--color-heading); font-family: 'Montserrat', sans-serif; 
    font-weight: 500; font-size: 0.85rem; letter-spacing: 1.5px; text-transform: uppercase; 
    transition: color 0.3s ease;
}
.primary-menu-container ul li a:hover { color: var(--color-accent); }

/* BUTON VE İKON KİLİDİ */
.header-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 20px !important;
    flex-wrap: nowrap !important;
    flex: 0 0 auto !important;
}

.instagram-icon { font-size: 1.5rem; color: var(--color-heading); text-decoration: none !important; transition: color 0.3s; }
.instagram-icon:hover { color: #E1306C; }

.menu-toggle { display: none; flex-direction: column; gap: 6px; background: none; border: none; cursor: pointer; z-index: 1100; padding: 5px; }
.menu-toggle span { display: block; width: 28px; height: 2px; background-color: var(--color-heading); transition: 0.3s; }

/* AÇILIR MENÜ (DESKTOP) */
.primary-menu-container ul ul.sub-menu {
    position: absolute !important; top: 100% !important; left: 0 !important; background-color: var(--color-white) !important;
    border: 1px solid var(--color-divider) !important; border-top: 3px solid var(--color-accent) !important; 
    box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important; min-width: 250px !important; display: none !important; 
    flex-direction: column !important; gap: 0 !important; z-index: 9999 !important; padding: 0 !important;
}
.primary-menu-container ul li:hover > ul.sub-menu { display: flex !important; }
.primary-menu-container ul ul.sub-menu a { padding: 15px 20px !important; border-bottom: 1px solid var(--color-section-bg) !important; font-size: 0.8rem !important; letter-spacing: 1px !important; text-transform: none !important; }
.primary-menu-container ul ul.sub-menu li:last-child a { border-bottom: none !important; }

/* ==========================================================================
   5.1 MOBİL MENÜ AYARLARI
   ========================================================================== */
@media (max-width: 768px) {
    .header-container { padding: 15px 5% !important; justify-content: space-between !important; }
    .site-logo img { max-width: 200px !important; }
    .site-slogan { font-size: 0.65rem; }
    
    .menu-toggle { display: flex !important; margin-left: auto !important; }
    .menu-toggle.is-active span { background-color: #ffffff !important; }

    .main-navigation {
        position: fixed !important; top: 0 !important; right: -100% !important; width: 100% !important; height: 100vh !important;
        background: #2c2c2c !important; transition: 0.4s ease-in-out !important; z-index: 1050 !important;
        display: flex !important; justify-content: flex-end !important; align-items: flex-start !important; padding-top: 100px !important; 
    }
    .main-navigation.is-active { right: 0 !important; }

    .menu-wrapper { flex-direction: column !important; width: 100% !important; gap: 30px !important; text-align: right !important; padding-right: 25px !important; }
    
    .primary-menu-container ul { flex-direction: column !important; width: 100% !important; gap: 20px !important; align-items: flex-end !important; }
    .primary-menu-container ul li a { font-size: 1.2rem !important; color: #ffffff !important; white-space: normal !important; }

    .primary-menu-container ul ul.sub-menu {
        position: relative !important; display: flex !important; border: none !important; box-shadow: none !important; 
        background: transparent !important; padding: 10px 0 0 0 !important; align-items: flex-end !important;
    }
    .primary-menu-container ul ul.sub-menu a { font-size: 0.9rem !important; color: #a0c49d !important; padding: 8px 0 !important; }

    .header-actions { flex-direction: row !important; gap: 20px !important; margin-top: 30px !important; justify-content: flex-end !important; width: 100% !important; }
    .header-actions .instagram-icon { color: #ffffff !important; }

    .menu-toggle.is-active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
    .menu-toggle.is-active span:nth-child(2) { opacity: 0; }
    .menu-toggle.is-active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
}

/* ==========================================================================
   6. DİĞER SAYFA AYARLARI & GÖRSELLER
   ========================================================================== */
.page-featured-image.full-width-image { position: relative !important; width: 100vw; left: 50%; transform: translateX(-50%); margin-bottom: 60px; display: block; line-height: 0; }
.page-featured-image.full-width-image img { width: 100%; height: 600px; object-fit: cover; object-position: center 60%; display: block; }
h1.image-overlay-title { position: absolute !important; bottom: 40px !important; right: 10% !important; color: #ffffff !important; font-size: 3.5rem !important; font-family: 'Playfair Display', serif !important; font-weight: 700 !important; z-index: 99 !important; text-align: right !important; margin: 0 !important; text-shadow: 2px 2px 20px rgba(0, 0, 0, 0.7) !important; pointer-events: none; }
@media (max-width: 768px) { h1.image-overlay-title { font-size: 2rem !important; right: 5% !important; bottom: 20px !important; } .page-featured-image.full-width-image img { height: 37.5vw !important; min-height: 200px; } }

.kontakt-grid { display: flex; gap: 40px; align-items: flex-start; margin-top: 30px; margin-bottom: 40px; }
.kontakt-text { flex: 1; } .kontakt-karte { flex: 1; width: 100%; }
.kontakt-karte iframe { width: 100%; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); }
@media (max-width: 768px) { .kontakt-grid { flex-direction: column; gap: 30px; } }

.site-footer { background-color: var(--color-section-bg); border-top: 1px solid var(--color-divider); padding: 40px 5% 20px; margin-top: 80px; }
.footer-container { max-width: 1000px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 20px; }
.footer-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 25px; justify-content: center; flex-wrap: wrap; }
.footer-navigation a { color: var(--color-text); font-family: 'Montserrat', sans-serif; font-size: 0.8rem; font-weight: 500; letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none !important; transition: color 0.3s ease; }
.footer-navigation a:hover { color: var(--color-accent); }
.site-info p { font-size: 0.8rem; font-family: 'Montserrat', sans-serif; color: #777; margin: 0; text-align: center; }

.faq-accordion details { border-bottom: 1px solid var(--color-divider); padding: 15px 0; }
.faq-accordion details:first-child { border-top: 1px solid var(--color-divider); }
.faq-accordion summary { font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 1.1rem; color: var(--color-heading); cursor: pointer; list-style: none; position: relative; padding-right: 30px; transition: color 0.3s ease; }
.faq-accordion summary::-webkit-details-marker { display: none; }
.faq-accordion summary::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); color: var(--color-accent); font-size: 1.5rem; font-weight: 400; line-height: 1; }
.faq-accordion details[open] summary::after { content: '−'; }
.faq-accordion summary:hover { color: var(--color-accent); }
.faq-content { padding-top: 15px; color: var(--color-text); font-family: 'Montserrat', sans-serif; font-size: 1rem; }

.whatsapp-float { position: fixed; width: 60px; height: 60px; bottom: 40px; right: 40px; background-color: #25d366; color: #FFF !important; border-radius: 50px; text-align: center; font-size: 35px; box-shadow: 2px 2px 15px rgba(0,0,0,0.2); z-index: 9999; display: flex; align-items: center; justify-content: center; text-decoration: none !important; transition: all 0.3s ease; }
.whatsapp-float:hover { background-color: #128C7E; transform: scale(1.1); }
@media (max-width: 768px) { .whatsapp-float { width: 50px; height: 50px; bottom: 20px; right: 20px; font-size: 28px; } }

.page .entry-title, .page h1:first-of-type:not(.image-overlay-title) { display: none !important; }

/* ==========================================================================
   HAYALET BOŞLUK ÇİZGİSİNİ YOK EDEN KESİN KOD
   ========================================================================== */
.site-header .site-logo a.custom-logo-link,
.site-header .site-logo a {
    text-decoration: none !important;
    border: none !important;
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    font-size: 0 !important;       /* Görünmez boşluğu fiziksel olarak yok eder */
    line-height: 0 !important;     /* Yükseklik payını sıfırlar */
    color: transparent !important; /* Rengini tamamen şeffaf yapar */
    display: block !important;
}

/* ==========================================================================
   YANLIŞLIKLA ORTAYA ÇIKAN MOBİL MENÜ BUTONUNU GİZLEME KODU
   ========================================================================== */
button.menu-toggle,
#mobile-menu-button {
    display: none !important; /* Masaüstünde KESİNLİKLE gizler */
    background-color: transparent !important; /* O gereksiz kalın yeşil rengi siler */
    padding: 5px !important; /* Dev buton boşluklarını yok eder */
    min-width: auto !important;
}

/* Sadece cep telefonuna inildiğinde görünmesine izin verir */
@media (max-width: 768px) {
    button.menu-toggle,
    #mobile-menu-button {
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
    }
}