/* ============================================
   PAGE TITLE FIX — Dark text on light backgrounds
   ============================================ */

/* ---- Main page title headings ---- */
.page-title h1,
.page-title h2,
.page-title-section h1,
.page-title-section h2,
.start-page-title h1,
.start-page-title h2,
.section-title h1,
.section-title h2,
.page-header h1,
.page-header h2 {
    color: #1e293b !important;        /* dark slate — almost black */
    text-shadow: none !important;       /* remove any white text shadow */
}

/* ---- Subtitle / paragraph under title ---- */
.page-title p,
.page-title-section p,
.start-page-title p,
.section-title p,
.page-header p {
    color: #475569 !important;        /* medium gray-blue */
    text-shadow: none !important;
}

/* ---- Breadcrumb text ---- */
.breadcrumb,
.breadcrumb a,
.breadcrumb span,
.breadcrumb li,
.breadcrumb-item,
.breadcrumb-item a {
    color: #1e293b !important;
}

/* ---- Breadcrumb active/current page ---- */
.breadcrumb-item.active,
.breadcrumb .active {
    color: #2563eb !important;        /* your brand blue for active item */
}

/* ---- If there's a dark overlay hiding text ---- */
.page-title::before,
.page-title-section::before,
.start-page-title::before,
.page-header::before,
.section-title::before {
    background: transparent !important;
    opacity: 0 !important;
}

/* ---- Light background fallback for title areas ---- */
.page-title,
.page-title-section,
.start-page-title,
.page-header,
.section-title {
    background: #f8fafc !important;   /* very light gray-blue */
}

/* ---- Force any inline white styles to dark ---- */
.page-title [style*="color: #fff"],
.page-title [style*="color: #ffffff"],
.page-title [style*="color: white"],
.page-title-section [style*="color: #fff"],
.page-title-section [style*="color: #ffffff"],
.page-title-section [style*="color: white"],
.start-page-title [style*="color: #fff"],
.start-page-title [style*="color: #ffffff"],
.start-page-title [style*="color: white"] {
    color: #1e293b !important;
}

/* ============================================
   MOBILE RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
    .page-title h1,
    .page-title-section h1,
    .start-page-title h1,
    .page-header h1,
    .section-title h1 {
        font-size: 1.8rem !important;
    }
    
    .page-title h2,
    .page-title-section h2,
    .start-page-title h2,
    .page-header h2,
    .section-title h2 {
        font-size: 1.4rem !important;
    }
}