/*
Theme Name: DT Simple Theme
... (all the theme header comments) ...
*/

/*
 * ===================================================================
 * TEST RULE: This will turn the red box GREEN if this file is loading.
 * ===================================================================
 */
#css-test-box {
    background: green !important;
}

body {
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    line-height: 1.6;
    background: #f9f9f9;
    color: #333;
    margin: 0;
}

/* --- NEW FONT RULE --- */
h1, h2, h3, h4, h5, h6,
.sub-link-title, /* Mega Menu Sub-title */
.my-menu-featured p, /* Mega Menu Featured Title */
.dtmm-slideout-header h3, /* Slideout Menu Title */
.dt-hero-content h1, /* Hero Title */
.dt-hero-mobile-title h1 /* Mobile Hero Title */
{
    font-family: 'Fredoka', sans-serif;
}
/* --- END NEW --- */

.content-wrap {
    max-width: 1100px;
    
    /* --- FIX: Restore Centering & Remove Bottom Gap --- */
    margin-top: 2rem;
    margin-bottom: 0;      /* Kill gap before footer */
    margin-left: auto;     /* Center Horizontally */
    margin-right: auto;    /* Center Horizontally */
    /* -------------------------------------------------- */
    
    padding: 2rem;
    background: #fff;
    border-radius: 8px;
}

/* --- Header & Footer --- */
.site-header {
    position: fixed;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    width: 95%;
    max-width: 1400px;
    z-index: 1000;
    padding: 0;
    box-shadow: none;
    background: #fff;
}

.site-logo {
    position: relative;
    left: 10px;
    top: 15px;
    padding-bottom: 1.5rem; 
}

.header-inner {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    justify-content: flex-start; 
    align-items: center;
    gap: 1.5rem; 
}

.desktop-auth {
    margin-left: auto;
}

.site-content {
    padding-top: 140px; 
}
/* --- Course Full Width Override --- */
.site-content.dt-theme-full-width {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    
    /* Push content down below the header */
    padding-top: 145px !important; 
    
    display: block;
}

/*
 * ===================================================================
 * SINGLE POST LAYOUT (One Box Style - 1200px)
 * ===================================================================
 */

body.single-post .content-wrap {
    max-width: 1300px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.post-layout-container {
    display: grid;
    grid-template-columns: 300px 1fr;
    grid-template-areas: "sidebar main";
    gap: 40px;
}

.post-content-main {
    grid-area: main;
    min-width: 0;
    background: none;
    padding: 0;
    box-shadow: none;
}

.post-sticky-sidebar {
    grid-area: sidebar;
}

.post-sticky-sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 160px;
    align-self: flex-start;
}

.post-sticky-sidebar .widget {
    background: none;
    padding: 0;
    border-radius: 0;
    margin-bottom: 25px;
}

.post-sticky-sidebar .widget-title {
    margin-top: 0;
    font-size: 1.2rem;
    font-weight: 600;
    color: #333;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 10px;
    margin-bottom: 15px;
}
    
.post-sticky-sidebar .widget_dt_author_bio_widget {
    background: #f9f5ff;
    padding: 25px;
    border-radius: 12px;
}

.widget_dt_author_bio_widget .author-bio-image {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 15px;
    border: 3px solid #fff;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.widget_dt_author_bio_widget .author-bio-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.widget_dt_author_bio_widget .author-bio-text p {
    font-size: 0.9rem;
    color: #555;
    line-height: 1.6;
    margin-bottom: 0;
}

.post-content-main .entry-title {
    margin-top: 0;
    font-size: 2.8rem;
    line-height: 1.2;
}
.post-content-main .post-featured-image {
    margin: 20px 0;
    border-radius: 12px;
    overflow: hidden;
}
.post-content-main .post-featured-image img {
    width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 960px) {
    .post-layout-container {
        grid-template-columns: 1fr;
        grid-template-areas:
            "main"
            "sidebar";
        gap: 30px;
    }

    .post-sticky-sidebar {
        position: static;
        top: auto;
    }
    
    body.single-post .content-wrap {
        padding: 1.5rem;
    }
}

/*
 * ===================================================================
 * NEW: Post Meta Bar (Author, Date, etc.)
 * ===================================================================
 */
.post-meta-bar {
    background: #f9f5ff;
    border-radius: 10px;
    padding: 15px 20px;
    margin-top: 25px;
    margin-bottom: 25px;
    display: flex;
    flex-wrap: wrap;
    gap: 15px 25px;
    font-size: 0.9rem;
    color: #5f5f5f;
}

.post-meta-bar .meta-item {
    display: block;
    line-height: 1.4;
}

.post-meta-bar .meta-item a {
    color: #333;
    font-weight: 600;
    text-decoration: none;
}

.post-meta-bar .meta-item a:hover {
    text-decoration: underline;
}

/*
 * ===================================================================
 * NEW: Contained Page Template (1200px)
 * ===================================================================
 */
body.page-template-template-contained .content-wrap {
    max-width: 1300px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-top: 2rem;
    margin-bottom: 0; /* FIX: Changed from 2rem to 0 to remove footer gap */
    margin-left: auto; /* Ensure centering */
    margin-right: auto; /* Ensure centering */
}
.page-contained .entry-title {
    margin-top: 0;
    font-size: 2.8rem;
    line-height: 1.2;
    margin-bottom: 25px;
}

/*
 * ===================================================================
 * NEW: Contained Page Template (1500px)
 * ===================================================================
 */
body.page-template-template-contained-1500 .content-wrap {
    max-width: 1500px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-top: 2rem;
    margin-bottom: 0; /* FIX: Changed from 2rem to 0 */
    margin-left: auto;
    margin-right: auto;
}

/*
 * ===================================================================
 * NEW: Contained Page Template (1800px)
 * ===================================================================
 */
body.page-template-template-contained-1800 .content-wrap {
    max-width: 1800px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-top: 2rem;
    margin-bottom: 0; /* FIX: Changed from 2rem to 0 */
    margin-left: auto;
    margin-right: auto;
}

/*
 * ===================================================================
 * NEW: Contained Page Template (1200px)
 * ===================================================================
 */
body.page-template-template-contained-1200 .content-wrap {
    max-width: 1200px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-top: 2rem;
    margin-bottom: 0; /* FIX: Changed from 2rem to 0 */
    margin-left: auto;
    margin-right: auto;
}

/*
 * ===================================================================
 * NEW: Contained Page Template (1400px)
 * ===================================================================
 */
body.page-template-template-contained-1400 .content-wrap {
    max-width: 1400px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-top: 2rem;
    margin-bottom: 0; /* FIX: Changed from 2rem to 0 */
    margin-left: auto;
    margin-right: auto;
}

/*
 * ===================================================================
 * NEW: Contained Page Template (1600px)
 * ===================================================================
 */
body.page-template-template-contained-1600 .content-wrap {
    max-width: 1600px;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-top: 2rem;
    margin-bottom: 0; /* FIX: Changed from 2rem to 0 */
    margin-left: auto;
    margin-right: auto;
}


/*
 * ===================================================================
 * GLOBAL BUTTON STYLES (Pill Shape)
 * ===================================================================
 */

:root {
    --btn-primary-bg: #6a4c89; /* The purple from your screenshot */
    --btn-primary-text: #ffffff;
    --btn-secondary-border: #a987c2; /* Lighter purple for border */
    --btn-secondary-text: #333333;
    --btn-radius: 999px; /* Fully rounded pill shape */
}

/* --- 1. Primary Buttons (Solid Purple) --- */
/* Target all your various button classes */
.dt-hub-button, 
.lp-btn-primary, 
.dtcs-button-primary, 
.dtm-landing-page-button,
.dtm-download-button,
.dtm-lead-form-submit button,
.dt-quiz-submit,
.dt-next-lesson-button,
button[type="submit"]:not(.dt-accordion-button) {
    background-color: var(--btn-primary-bg) !important;
    color: var(--btn-primary-text) !important;
    border: 2px solid var(--btn-primary-bg) !important;
    border-radius: var(--btn-radius) !important;
    padding: 12px 30px !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    display: inline-block;
    line-height: 1.2;
}

.dt-hub-button:hover, 
.lp-btn-primary:hover, 
.dtcs-button-primary:hover, 
.dtm-landing-page-button:hover,
.dtm-download-button:hover,
.dtm-lead-form-submit button:hover,
.dt-quiz-submit:hover,
.dt-next-lesson-button:hover,
button[type="submit"]:not(.dt-accordion-button):hover {
    background-color: #563d70 !important; /* Darker purple on hover */
    border-color: #563d70 !important;
    transform: translateY(-2px);
}

/* --- 2. Secondary Buttons (Outline / White) --- */
.dtcs-button-secondary,
.dt-btn.owned {
    background-color: transparent !important;
    color: var(--btn-secondary-text) !important;
    border: 2px solid var(--btn-secondary-border) !important;
    border-radius: var(--btn-radius) !important;
    padding: 12px 30px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.dtcs-button-secondary:hover,
.dt-btn.owned:hover {
    background-color: var(--btn-primary-bg) !important;
    color: #fff !important;
    border-color: var(--btn-primary-bg) !important;
}

/* --- 3. Specific Override for Course Player "Mark Complete" --- */
/* Keeps it distinct but rounded */
.dt-complete-button {
    border-radius: var(--btn-radius) !important;
}

/* --- DT Communication Geo-Hiding --- */
/* Hide booking buttons by default to prevent FOUC (Flash on load). */
/* The JavaScript will forcefully UNHIDE the correct one later. */
.dtcc-local-only,
.dtcc-global-only {
    display: none !important;
}