/**
 * Simple Read More Toggle CSS
 * Clean, simple, no fade effects
 */

/* ============================================================
   CRITICAL: Ensure parent containers don't block content
   ============================================================ */
.container.homepage-intro-container,
div.container.homepage-intro-container,
.homepage-intro-container,
.homepage-intro,
div.homepage-intro {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
    min-height: auto !important;
    position: relative !important;
    z-index: 1 !important;
}

/* ============================================================
   Collapsed intro - HIDDEN by default (no fade)
   ============================================================ */
.intro-collapsed,
div.intro-collapsed,
#homepage-intro-collapsed,
div#homepage-intro-collapsed,
.intro-collapsed:not([style*="display: block"]):not([style*="display:block"]),
#homepage-intro-collapsed:not([style*="display: block"]):not([style*="display:block"]) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}

/* ============================================================
   Visible state - when toggled (simple show)
   ============================================================ */
.intro-collapsed[style*="display: block"],
#homepage-intro-collapsed[style*="display: block"],
.intro-collapsed[style*="display:block"],
#homepage-intro-collapsed[style*="display:block"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
    width: auto !important;
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

/* ============================================================
   Ensure parent doesn't interfere
   ============================================================ */
.homepage-intro,
div.homepage-intro {
    position: relative !important;
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

/* Toggle button styling */
.read-more-toggle,
.read-more-toggle-intro {
    font-weight: 600;
    display: inline-block;
    margin-top: 12px;
    margin-bottom: 0;
    cursor: pointer;
    color: #007bff;
    transition: color 0.2s ease;
    text-decoration: none;
}

.read-more-toggle:hover,
.read-more-toggle-intro:hover {
    color: #0056b3;
    text-decoration: none;
}

/* Toggle placeholder at end of expanded content */
.read-more-toggle-end-placeholder {
    margin-top: 20px;
    margin-bottom: 10px;
}

.read-more-toggle-end-placeholder .read-more-toggle-intro {
    margin-top: 0;
    margin-bottom: 0;
}

/* SEO text collapsed section */
.seo-text-collapsed,
div.seo-text-collapsed,
#seo-text-collapsed,
div#seo-text-collapsed,
.seo-text-collapsed:not([style*="display: block"]):not([style*="display:block"]),
#seo-text-collapsed:not([style*="display: block"]):not([style*="display:block"]) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}

.seo-text-collapsed[style*="display: block"],
#seo-text-collapsed[style*="display: block"],
.seo-text-collapsed[style*="display:block"],
#seo-text-collapsed[style*="display:block"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
    width: auto !important;
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

.read-more-toggle-seo {
    font-weight: 600;
    display: inline-block;
    margin-top: 12px;
    margin-bottom: 0;
    cursor: pointer;
    color: #007bff;
    transition: color 0.2s ease;
    text-decoration: none;
}

.read-more-toggle-seo:hover {
    color: #0056b3;
    text-decoration: none;
}

.read-more-toggle-end-placeholder-seo {
    margin-top: 20px;
    margin-bottom: 10px;
}

.read-more-toggle-end-placeholder-seo .read-more-toggle-seo {
    margin-top: 0;
    margin-bottom: 0;
}

/* SEO text mobile collapsing */
.seo-text-mobile-collapsed,
div.seo-text-mobile-collapsed,
#seo-text-mobile-collapsed,
div#seo-text-mobile-collapsed {
    display: block !important;
    visibility: visible !important;
}

.read-more-toggle-seo-mobile {
    font-weight: 600;
    display: none;
    margin-top: 12px;
    margin-bottom: 0;
    cursor: pointer;
    color: #007bff;
    transition: color 0.2s ease;
    text-decoration: none;
}

.read-more-toggle-seo-mobile:hover {
    color: #0056b3;
    text-decoration: none;
}

.read-more-toggle-end-placeholder-seo-mobile {
    margin-top: 20px;
    margin-bottom: 10px;
}

.read-more-toggle-end-placeholder-seo-mobile .read-more-toggle-seo-mobile {
    margin-top: 0;
    margin-bottom: 0;
}

/* Intro mobile collapsing */
.intro-mobile-collapsed,
div.intro-mobile-collapsed,
#intro-mobile-collapsed,
div#intro-mobile-collapsed {
    display: block !important;
    visibility: visible !important;
}

.read-more-toggle-intro-mobile {
    font-weight: 600;
    display: none;
    margin-top: 12px;
    margin-bottom: 0;
    cursor: pointer;
    color: #007bff;
    transition: color 0.2s ease;
    text-decoration: none;
}

.read-more-toggle-intro-mobile:hover {
    color: #0056b3;
    text-decoration: none;
}

.read-more-toggle-end-placeholder-intro-mobile {
    margin-top: 20px;
    margin-bottom: 10px;
}

.read-more-toggle-end-placeholder-intro-mobile .read-more-toggle-intro-mobile {
    margin-top: 0;
    margin-bottom: 0;
}

/* Why Turkey section collapsing */
.why-turkey-collapsed,
div.why-turkey-collapsed,
#why-turkey-collapsed,
div#why-turkey-collapsed,
.why-turkey-collapsed:not([style*="display: block"]):not([style*="display:block"]),
#why-turkey-collapsed:not([style*="display: block"]):not([style*="display:block"]) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}

.why-turkey-collapsed[style*="display: block"],
#why-turkey-collapsed[style*="display: block"],
.why-turkey-collapsed[style*="display:block"],
#why-turkey-collapsed[style*="display:block"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: none !important;
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
    width: auto !important;
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

.read-more-toggle-why-turkey {
    font-weight: 600;
    display: inline-block;
    margin-top: 12px;
    margin-bottom: 0;
    cursor: pointer;
    color: #007bff;
    transition: color 0.2s ease;
    text-decoration: none;
}

.read-more-toggle-why-turkey:hover {
    color: #0056b3;
    text-decoration: none;
}

.read-more-toggle-end-placeholder-why-turkey {
    margin-top: 20px;
    margin-bottom: 10px;
}

.read-more-toggle-end-placeholder-why-turkey .read-more-toggle-why-turkey {
    margin-top: 0;
    margin-bottom: 0;
}

/* Mobile: Unbold read more toggles and collapse SEO text */
@media (max-width: 767px) {
    .read-more-toggle,
    .read-more-toggle-intro,
    .read-more-toggle-seo,
    .read-more-toggle-seo-mobile,
    .read-more-toggle-intro-mobile,
    .read-more-toggle-why-turkey {
        font-weight: 500;
    }
    
    /* Show mobile toggles on mobile */
    .read-more-toggle-seo-mobile,
    .read-more-toggle-intro-mobile {
        display: inline-block !important;
    }
    
    /* Hide desktop toggles on mobile */
    .read-more-toggle-seo,
    .read-more-toggle-intro {
        display: none !important;
    }
    
    /* Collapse intro semantic text on mobile */
    .intro-mobile-collapsed,
    #intro-mobile-collapsed {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* Show when expanded on mobile */
    .intro-mobile-collapsed[style*="display: block"],
    #intro-mobile-collapsed[style*="display: block"],
    .intro-mobile-collapsed[style*="display:block"],
    #intro-mobile-collapsed[style*="display:block"] {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: none !important;
        overflow: visible !important;
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }
    
    /* Collapse SEO text after first paragraph on mobile */
    .seo-text-mobile-collapsed,
    #seo-text-mobile-collapsed {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* Show when expanded on mobile */
    .seo-text-mobile-collapsed[style*="display: block"],
    #seo-text-mobile-collapsed[style*="display: block"],
    .seo-text-mobile-collapsed[style*="display:block"],
    #seo-text-mobile-collapsed[style*="display:block"] {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: none !important;
        overflow: visible !important;
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }
}

/* Desktop: Show desktop toggle, hide mobile toggle, show all content */
@media (min-width: 768px) {
    .read-more-toggle-seo-mobile,
    .read-more-toggle-intro-mobile {
        display: none !important;
    }
    
    .read-more-toggle-seo,
    .read-more-toggle-intro {
        display: inline-block !important;
    }
    
    /* Always show all content on desktop */
    .seo-text-mobile-collapsed,
    #seo-text-mobile-collapsed,
    .intro-mobile-collapsed,
    #intro-mobile-collapsed {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}