/*
 * MarathiBaraKhadi.com - Dark Mode Override CSS
 * Soft dark-cocoa theme to protect children's eyes while retaining playfulness.
 */

.dark-theme {
    --bg-color: #1A130C;
    --card-bg: #2A1F16;
    --text-color: #FCEFD5;
    --text-muted: #AF9884;
    --border-color: #38291D;
    
    --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.25);
    --shadow-medium: 0 15px 40px rgba(0, 0, 0, 0.35);
    --shadow-hover: 0 20px 45px rgba(255, 122, 0, 0.25);
    --shadow-inset: inset 0 2px 5px rgba(0, 0, 0, 0.2);
}

/* Specific Dark Mode Adjustments */
.dark-theme header {
    background-color: rgba(26, 19, 12, 0.85);
    border-bottom-color: var(--border-color);
}

.dark-theme .logo-block {
    box-shadow: 0 4px 12px rgba(255, 122, 0, 0.4);
}

.dark-theme .nav-links a:hover,
.dark-theme .nav-links a.active {
    background-color: rgba(255, 122, 0, 0.15);
}

.dark-theme .letter-card {
    background: #231911;
}

.dark-theme .letter-card:hover {
    background: var(--card-bg);
}

.dark-theme .btn-secondary {
    color: #1A130C;
}

.dark-theme .floating-shape {
    opacity: 0.05;
}

.dark-theme .quiz-option {
    background-color: #231911;
}

.dark-theme .quiz-option:hover {
    background-color: var(--card-bg);
}

.dark-theme .quiz-progress {
    background-color: var(--border-color);
}

.dark-theme .results-score-circle {
    border-color: var(--primary);
}

.dark-theme .drop-zone {
    background-color: rgba(0, 0, 0, 0.2);
}

.dark-theme .certificate-border {
    background-color: #2A1F16;
    background-image: radial-gradient(circle, #1A130C 20%, transparent 20%), radial-gradient(circle, #1A130C 20%, transparent 20%);
}

.dark-theme .certificate-inner {
    background-color: #1A130C;
    border-color: var(--secondary);
}

.dark-theme .cert-sig {
    border-top-color: var(--border-color);
}

.dark-theme footer {
    background-color: #1A130C;
    border-top-color: var(--border-color);
}

.dark-theme #drawing-canvas {
    background: transparent;
}

.dark-theme .canvas-wrapper {
    background: #110B07;
}

.dark-theme .color-dot.active {
    border-color: var(--text-color);
}

/* Custom scrollbars for Dark Mode */
.dark-theme ::-webkit-scrollbar {
    width: 10px;
}
.dark-theme ::-webkit-scrollbar-track {
    background: #1A130C;
}
.dark-theme ::-webkit-scrollbar-thumb {
    background: #3A2F26;
    border-radius: 5px;
}
.dark-theme ::-webkit-scrollbar-thumb:hover {
    background: var(--primary);
}
