/*
 * DCG Career Accelerator - LearnDash UI Overrides
 * Maps LearnDash 3.0 elements to the DCG brand (Navy, Gold, Cream)
 */

/* ==========================================================================
   GLOBAL VARIABLES MAP
   ========================================================================== */
:root {
    --dcg-blue: #002d56;
    --dcg-blue-dark: #001a33;
    --dcg-gold: #ff9900;
    --dcg-gold-hover: #e68a00;
    --dcg-cream: #f8f3ea;
    --dcg-accent-blue: #00aced;
    --dcg-green: #10b981;
    --dcg-red: #ef4444;
    --dcg-text: #334155;
    --dcg-text-light: #64748b;
    --dcg-bg-light: #f8fafc;
    --dcg-border: #e2e8f0;
}

/* ==========================================================================
   ENCLOSING WRAPPER (LD3.0)
   ========================================================================== */
.learndash-wrapper {
    font-family: 'Figtree', sans-serif !important;
    color: var(--dcg-text) !important;
    max-width: 1100px;
    margin: 0 auto;
}

/* Main Headers within LD */
.learndash-wrapper .ld-course-header .ld-course-title,
.learndash-wrapper .ld-lesson-header .ld-lesson-title,
.learndash-wrapper .ld-topic-header .ld-topic-title {
    font-weight: 900 !important;
    color: var(--dcg-blue) !important;
}

/* ==========================================================================
   PROGRESS BARS
   ========================================================================== */
.learndash-wrapper .ld-progress {
    background-color: var(--dcg-bg-light) !important;
    border: none !important;
    border-radius: 999px !important;
    height: 12px !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden;
}

.learndash-wrapper .ld-progress .ld-progress-bar {
    background-color: var(--dcg-gold) !important;
    border-radius: 999px !important;
    background-image: linear-gradient(90deg, var(--dcg-gold), #ffad33) !important;
}

.learndash-wrapper .ld-progress .ld-progress-percentage {
    color: var(--dcg-blue) !important;
    font-weight: 800 !important;
    font-size: 0.875rem !important;
    margin-bottom: 0.5rem !important;
}

.learndash-wrapper .ld-progress .ld-progress-steps {
    color: var(--dcg-text-light) !important;
    font-weight: 600 !important;
}

/* ==========================================================================
   CARDS AND LISTS (Lesson Rows, Topic Rows)
   ========================================================================== */
.learndash-wrapper .ld-item-list .ld-item-list-item {
    background-color: #ffffff !important;
    border-radius: 1rem !important;
    border: 1px solid var(--dcg-border) !important;
    margin-bottom: 1rem !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
    transition: all 0.2s ease-in-out !important;
    overflow: hidden;
}

.learndash-wrapper .ld-item-list .ld-item-list-item:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06) !important;
    border-color: #cbd5e1 !important;
}

.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-title {
    font-weight: 700 !important;
    color: var(--dcg-blue) !important;
    font-size: 1.125rem !important;
}

/* Status Icons */
.learndash-wrapper .ld-status-icon {
    border: 2px solid var(--dcg-border) !important;
}

.learndash-wrapper .ld-status-icon.ld-status-complete {
    background-color: var(--dcg-green) !important;
    border-color: var(--dcg-green) !important;
}

.learndash-wrapper .ld-status-icon.ld-status-incomplete {
    background-color: transparent !important;
    border-color: var(--dcg-gold) !important;
}

.learndash-wrapper .ld-icon-check {
    color: #ffffff !important;
}

.learndash-wrapper .ld-expand-button {
    color: var(--dcg-text-light) !important;
}

/* Sub-items (Topics underneath a Lesson) */
.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-items {
    background-color: var(--dcg-bg-light) !important;
    border-top: 1px solid var(--dcg-border) !important;
}

.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-items .ld-item-list-item {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
    border-bottom: 1px solid var(--dcg-border) !important;
    border-radius: 0 !important;
}

.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-items .ld-item-list-item:last-child {
    border-bottom: none !important;
}

/* ==========================================================================
   BUTTONS (Mark Complete, Back to Course, etc.)
   ========================================================================== */
.learndash-wrapper .btn,
.learndash-wrapper .ld-button {
    background-color: var(--dcg-gold) !important;
    color: var(--dcg-blue) !important;
    font-weight: 800 !important;
    padding: 0.75rem 1.5rem !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 4px 10px rgba(255, 153, 0, 0.2) !important;
    text-transform: none !important;
    border: none !important;
    transition: all 0.3s ease !important;
}

.learndash-wrapper .btn:hover,
.learndash-wrapper .ld-button:hover {
    background-color: var(--dcg-gold-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 15px rgba(255, 153, 0, 0.3) !important;
}

/* Secondary Buttons */
.learndash-wrapper .ld-button.ld-button-transparent,
.learndash-wrapper .ld-content-actions .ld-previous .ld-button {
    background-color: #ffffff !important;
    color: var(--dcg-text) !important;
    border: 1px solid var(--dcg-border) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02) !important;
}

.learndash-wrapper .ld-button.ld-button-transparent:hover,
.learndash-wrapper .ld-content-actions .ld-previous .ld-button:hover {
    background-color: var(--dcg-bg-light) !important;
    border-color: #cbd5e1 !important;
    transform: translateY(-1px) !important;
    color: var(--dcg-blue) !important;
}

/* Mark Complete Button */
.learndash-wrapper form.ld-mark-complete input[type="submit"] {
    background-color: var(--dcg-blue) !important;
    color: #ffffff !important;
    font-size: 1.125rem !important;
    padding: 1rem 2rem !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 15px rgba(0, 45, 86, 0.2) !important;
}

.learndash-wrapper form.ld-mark-complete input[type="submit"]:hover {
    background-color: var(--dcg-blue-dark) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 45, 86, 0.3) !important;
}

/* ==========================================================================
   TABS (Materials, Video, Course Info)
   ========================================================================== */
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab {
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    color: var(--dcg-text-light) !important;
    font-weight: 700 !important;
    padding: 1rem 1.5rem !important;
    margin-right: 1rem !important;
}

.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab.ld-active {
    color: var(--dcg-blue) !important;
    border-bottom-color: var(--dcg-gold) !important;
}

/* ==========================================================================
   ALERTS / BANNERS
   ========================================================================== */
.learndash-wrapper .ld-alert-warning {
    background-color: #fffbeb !important;
    border-left: 4px solid var(--dcg-gold) !important;
    color: #92400e !important;
    border-radius: 0.5rem !important;
    padding: 1rem 1.5rem !important;
}

.learndash-wrapper .ld-alert-success {
    background-color: #f0fdf4 !important;
    border-left: 4px solid var(--dcg-green) !important;
    color: #166534 !important;
    border-radius: 0.5rem !important;
    padding: 1rem 1.5rem !important;
}

/* ==========================================================================
   FOCUS MODE (LESSON/TOPIC VIEW)
   ========================================================================== */
body.ld-in-focus-mode {
    background-color: var(--dcg-bg-light) !important;
}

/* Header */
body.ld-in-focus-mode .ld-focus-header {
    background-color: var(--dcg-blue) !important;
    border-bottom: 2px solid var(--dcg-gold) !important;
}

body.ld-in-focus-mode .ld-focus-header .ld-brand-logo {
    display: none !important;
}

body.ld-in-focus-mode .ld-focus-header .ld-content-action a:not(.ld-button),
body.ld-in-focus-mode .ld-focus-header .ld-course-title {
    color: #ffffff !important;
}

body.ld-in-focus-mode .ld-focus-header .ld-progress .ld-progress-percentage,
body.ld-in-focus-mode .ld-focus-header .ld-progress .ld-progress-steps {
    color: #ffffff !important;
}

body.ld-in-focus-mode .ld-focus-header .ld-progress {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

body.ld-in-focus-mode .ld-focus-header .ld-focus-sidebar-trigger {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
    border-radius: 0.5rem !important;
}

/* User Menu */
body.ld-in-focus-mode .ld-user-menu .ld-user-menu-items {
    background-color: #ffffff !important;
    border-radius: 1rem !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1) !important;
}

body.ld-in-focus-mode .ld-user-menu .ld-user-menu-items a {
    color: var(--dcg-blue) !important;
}

body.ld-in-focus-mode .ld-user-menu .ld-user-menu-items a:hover {
    background-color: var(--dcg-bg-light) !important;
}

/* Sidebar */
body.ld-in-focus-mode .ld-focus-sidebar {
    background-color: #ffffff !important;
    border-right: 1px solid var(--dcg-border) !important;
    box-shadow: 4px 0 20px rgba(0, 0, 0, 0.02) !important;
}

body.ld-in-focus-mode .ld-focus-sidebar .ld-course-navigation-heading {
    background-color: var(--dcg-bg-light) !important;
    border-bottom: 1px solid var(--dcg-border) !important;
    padding: 1.5rem !important;
}

body.ld-in-focus-mode .ld-focus-sidebar .ld-course-navigation-heading,
body.ld-in-focus-mode .ld-focus-sidebar .ld-course-navigation-heading a,
body.ld-in-focus-mode .ld-focus-sidebar .ld-course-navigation-heading h3 {
    color: var(--dcg-blue) !important;
    font-weight: 900 !important;
}

body.ld-in-focus-mode .ld-focus-sidebar .ld-lesson-item {
    border-bottom: 1px solid var(--dcg-border) !important;
    transition: all 0.2s ease !important;
}

body.ld-in-focus-mode .ld-focus-sidebar .ld-lesson-item:hover {
    background-color: var(--dcg-bg-light) !important;
}

body.ld-in-focus-mode .ld-focus-sidebar .ld-lesson-item.ld-is-current-lesson {
    background-color: #fff9f0 !important;
    border-left: 4px solid var(--dcg-gold) !important;
}

body.ld-in-focus-mode .ld-focus-sidebar .ld-lesson-item .ld-lesson-item-preview-heading {
    color: var(--dcg-blue) !important;
    font-weight: 800 !important;
}

/* Main Content Area */
body.ld-in-focus-mode .ld-focus-main .ld-focus-content {
    background-color: #ffffff !important;
    border-radius: 1.5rem !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
    margin: 2rem auto !important;
    padding: 3rem !important;
    max-width: 900px !important;
}

body.ld-in-focus-mode .ld-focus-main .ld-focus-content h1 {
    color: var(--dcg-blue) !important;
    font-weight: 900 !important;
    font-size: 2.5rem !important;
    margin-bottom: 2rem !important;
    border-bottom: 2px solid var(--dcg-bg-light) !important;
    padding-bottom: 1rem !important;
}

@media (max-width: 768px) {
    body.ld-in-focus-mode .ld-focus-main .ld-focus-content {
        margin: 1rem !important;
        padding: 1.5rem !important;
    }
}
