/* =============================================
   THEME TOGGLE BUTTON
   ============================================= */

.theme-toggle-btn {
    cursor: pointer;
    background-color: rgb(118, 179, 199);
    border: none;
    border-radius: 20px;
    padding: 5px 14px 5px 10px;
    font-size: 0.78rem;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    color: white;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1;
    transition: background-color 0.2s;
    white-space: nowrap;
    vertical-align: middle;
}

.theme-toggle-btn:hover {
    background-color: rgb(85, 148, 168);
    color: white;
}

.theme-toggle-btn .fa {
    font-size: 0.85rem;
}

/* Inside the navbar-nav li */
.navbar-nav .nav-item .theme-toggle-btn {
    margin: 6px 0 6px 22px;
}

/* On mobile (hamburger expanded), full-width feel */
@media (max-width: 991px) {
    .navbar-nav .nav-item .theme-toggle-btn {
        margin: 6px 0 6px 35px;
    }
}

/* Topnav (success page) */
.topnav .theme-toggle-btn {
    margin: 0 8px;
}

/* =============================================
   DARK MODE OVERRIDES
   ============================================= */

/* --- Global --- */
html[data-theme="dark"] body {
    background-color: #12151e;
    color: #dde1ea;
}

html[data-theme="dark"] .theme-toggle-btn {
    background-color: rgba(118, 179, 199, 0.2);
    color: rgb(118, 179, 199);
}

html[data-theme="dark"] .theme-toggle-btn:hover {
    background-color: rgb(118, 179, 199);
    color: #12151e;
}

/* --- Navbar (Bootstrap) --- */
html[data-theme="dark"] .navbar {
    background-color: #12151e !important;
    border-bottom-color: rgb(85, 148, 168);
}

html[data-theme="dark"] .navbar .nav-link {
    color: #c8cdd8;
}

html[data-theme="dark"] .navbar .nav-link:hover,
html[data-theme="dark"] .navbar .nav-link.active {
    color: rgb(118, 179, 199);
}

html[data-theme="dark"] .navbar .dropdown-menu {
    background-color: #1c2030;
    border-color: #2d3348;
}

html[data-theme="dark"] .navbar .dropdown-item {
    color: #c8cdd8;
}

html[data-theme="dark"] .navbar .dropdown-item:hover {
    background-color: #262d42;
    color: rgb(118, 179, 199);
}

html[data-theme="dark"] .navbar-toggler {
    border-color: rgba(118, 179, 199, 0.4);
}

html[data-theme="dark"] .navbar-toggler-icon {
    filter: invert(1) sepia(1) saturate(0.5) hue-rotate(170deg);
}

/* Mobile dropdown inherits bg */
@media (max-width: 992px) {
    html[data-theme="dark"] .navbar .dropdown-menu {
        background-color: transparent;
        border: none;
    }
    html[data-theme="dark"] .navbar-collapse {
        background-color: #12151e;
        padding: 0 1rem 1rem;
    }
}

/* --- Old topnav (success page) --- */
html[data-theme="dark"] .topnav {
    background-color: #12151e;
}

html[data-theme="dark"] .topnav a {
    color: #c8cdd8;
}

html[data-theme="dark"] .topnav a:hover,
html[data-theme="dark"] .topnav a.active {
    color: rgb(118, 179, 199);
}

html[data-theme="dark"] .topnav a.icon {
    background-color: #12151e;
}

html[data-theme="dark"] .topnav.responsive {
    background-color: #12151e;
}

/* --- Footer --- */
html[data-theme="dark"] .footer-content {
    background-color: #0c0e14;
}

/* --- Hero --- */
html[data-theme="dark"] .hero-sub {
    color: #9fa6b8;
}

/* --- Trust bar (already brand-colored, fine) --- */

/* --- Sale section --- */
html[data-theme="dark"] .sale-section {
    background-color: #221d12;
}

html[data-theme="dark"] .sale-description {
    color: #cdd0d8;
}

html[data-theme="dark"] .sale-tiers li {
    background-color: #2d2618;
    border-color: #5a4a30;
}

html[data-theme="dark"] .sale-tier-hours {
    color: #b8bcc8;
}

html[data-theme="dark"] .sale-fine-print {
    color: #9098ad;
}

/* --- Services section (homepage) --- */
html[data-theme="dark"] .services-section {
    background-color: #171b28;
}

html[data-theme="dark"] .services-header h2,
html[data-theme="dark"] .services-header p {
    color: #dde1ea;
}

html[data-theme="dark"] .service-card {
    background-color: #1c2030;
    color: #dde1ea;
    border-color: #2d3348;
}

html[data-theme="dark"] .service-card:hover {
    color: #dde1ea;
    background-color: #212638;
}

html[data-theme="dark"] .service-card h3 {
    color: #eef0f5;
}

html[data-theme="dark"] .service-card p {
    color: #9fa6b8;
}

/* --- About section --- */
html[data-theme="dark"] .about-section {
    background-color: rgba(50, 80, 100, 0.2);
}

html[data-theme="dark"] .about-text h2,
html[data-theme="dark"] .about-faq h3 {
    color: #eef0f5;
}

html[data-theme="dark"] .about-text p,
html[data-theme="dark"] .about-faq p {
    color: #9fa6b8;
}

html[data-theme="dark"] .collapse,
html[data-theme="dark"] .collapsing {
    color: #dde1ea;
}

html[data-theme="dark"] .card {
    background-color: #1c2030;
    border-color: #2d3348;
    color: #dde1ea;
}

html[data-theme="dark"] .card-body {
    background-color: #1c2030;
    color: #dde1ea;
}

/* --- Reviews section --- */
html[data-theme="dark"] .reviews-section {
    background-color: #12151e;
}

/* --- Locations section --- */
html[data-theme="dark"] .locations-section {
    background-color: #12151e;
}

html[data-theme="dark"] .locations-heading {
    color: #eef0f5;
}

html[data-theme="dark"] .location-card {
    background-color: #1c2030;
}

html[data-theme="dark"] .location-card h3 {
    color: #eef0f5;
}

html[data-theme="dark"] .location-card p {
    color: #9fa6b8;
}

/* --- Contact page --- */
html[data-theme="dark"] #content-wrap h1 {
    color: #eef0f5;
}

html[data-theme="dark"] .contactintro > p {
    color: #9fa6b8;
}

html[data-theme="dark"] .contact-info-item a {
    color: #c8cdd8;
}

html[data-theme="dark"] .contact-info-item span {
    color: #9fa6b8;
}

html[data-theme="dark"] .contactform {
    background-color: #1c2030;
    border-color: rgba(118, 179, 199, 0.25);
}

html[data-theme="dark"] .contactform h3 {
    color: #eef0f5;
}

html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    background-color: #242838;
    border-color: #3a4055;
    color: #dde1ea;
}

html[data-theme="dark"] input[type="text"]::placeholder,
html[data-theme="dark"] input[type="email"]::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: #6a7285;
}

html[data-theme="dark"] label {
    color: #c8cdd8;
}

/* --- Doulas page --- */
html[data-theme="dark"] .section2container {
    background-color: #12151e;
}

html[data-theme="dark"] .DoulaContainer {
    background-color: #12151e;
}

html[data-theme="dark"] .section2title {
    background-color: rgba(150, 90, 100, 0.3);
}

/* --- Testimonials page --- */
/* The Elfsight widget is a third-party embed — its internals can't be themed.
   Wrap it in a white card so it looks intentional rather than jarring. */
html[data-theme="dark"] .pagecontent {
    background-color: #12151e;
    padding-top: 10px;
    padding-bottom: 40px;
}

html[data-theme="dark"] .googlereview {
    background-color: #ffffff;
    border-radius: 16px;
    padding: 30px 40px 30px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] #content-wrap h1 {
    color: #eef0f5;
}

html[data-theme="dark"] .title {
    background-color: rgba(28, 32, 48, 0.8);
    color: #eef0f5;
}

/* --- Services pages (servicesstyle.css) --- */
html[data-theme="dark"] .services-subnav {
    background-color: #12151e;
    border-bottom-color: #2d3348;
}

html[data-theme="dark"] .services-subnav a {
    color: #9fa6b8;
}

html[data-theme="dark"] .services-subnav a:hover {
    color: rgb(118, 179, 199);
    border-bottom-color: rgb(118, 179, 199);
}

html[data-theme="dark"] .service-section {
    background-color: #12151e;
}

html[data-theme="dark"] .service-section--alt {
    background-color: rgba(50, 80, 100, 0.2);
}

html[data-theme="dark"] .service-section-inner > h2 {
    color: #eef0f5;
}

html[data-theme="dark"] .service-intro {
    color: #9fa6b8;
}

html[data-theme="dark"] .service-note {
    color: #6a7285;
}

html[data-theme="dark"] .try-intro {
    color: #9fa6b8;
}

html[data-theme="dark"] .package-card {
    background-color: #1c2030;
    color: #dde1ea;
    border-color: #2d3348;
}

html[data-theme="dark"] .package-card:hover {
    color: #dde1ea;
    background-color: #212638;
}

html[data-theme="dark"] .package-name {
    color: #eef0f5;
}

html[data-theme="dark"] .package-card > p,
html[data-theme="dark"] .package-list li {
    color: #9fa6b8;
}

/* --- Success page --- */
html[data-theme="dark"] .successform {
    background-color: rgba(28, 32, 48, 0.9);
    color: #dde1ea;
}

html[data-theme="dark"] .successform h3,
html[data-theme="dark"] .contactintro h3 {
    color: #dde1ea;
}

/* --- Careers page --- */
html[data-theme="dark"] .job-description,
html[data-theme="dark"] .job-description p,
html[data-theme="dark"] .job-description li {
    color: #9fa6b8;
}

html[data-theme="dark"] .job-description h2,
html[data-theme="dark"] .job-description h3 {
    color: #eef0f5;
}
