/* === CSS Variables === */
:root {
    --color-white: #ffffff;
    --color-gray-200: #f5f5f5;
    --color-gray-300: #a7a9a9;
    --color-gray-400: #777c7c;
    --color-charcoal-700: #1f2121;
    --color-charcoal-800: #262828;
    --navbar-height: 56px;
}

/* === Светлая тема === */
.light-theme {
    background-color: #f0f2f5;
    color: #1f2121;
}

.light-theme body {
    background-color: #f0f2f5 !important;
    color: #1f2121 !important;
}

.light-theme .sidebar {
    background-color: #ffffff;
    border-right: 1px solid #e0e0e0;
}

.light-theme .sidebar-link {
    color: #444444;
}

.light-theme .sidebar-link:hover {
    background-color: #f0f2f5;
    color: #1f2121;
}

.light-theme .sidebar-item.active .sidebar-link {
    background-color: #e8f0fe;
    color: #409eff;
}

.light-theme .sidebar::-webkit-scrollbar-track { background: #f0f2f5; }
.light-theme .sidebar::-webkit-scrollbar-thumb { background: #cccccc; }

.light-theme .settings-section,
.light-theme .task-item,
.light-theme .stat-card,
.light-theme .course-card {
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    color: #1f2121;
}

.light-theme h1,
.light-theme h2,
.light-theme h3,
.light-theme .toggle-label {
    color: #1f2121;
}

.light-theme .toggle-desc,
.light-theme .sidebar-link {
    color: #666666;
}

.light-theme input,
.light-theme select,
.light-theme textarea {
    background-color: #ffffff;
    color: #1f2121;
    border: 1px solid #cccccc;
}

.light-theme .btn-secondary {
    background-color: #e0e0e0;
    color: #1f2121;
}

/* === Reset === */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-gray-200);
    background-color: var(--color-charcoal-700);
    -webkit-font-smoothing: antialiased;
    
    /* КРИТИЧНО для прижатия footer */
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* === Layout === */
.layout-container {
    display: flex;
    flex: 1 0 auto;
    padding-top: var(--navbar-height);
    position: relative;
}

.main-content {
    flex: 1;
    min-width: 0;
}

.container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 32px 20px;
}

/* === Светлая тема — переопределение переменных === */
.light-theme {
    --color-bg-dark: #ffffff;
    --color-bg-darker: #f8f8f8;
    --color-gray-200: #1f2121;
    --color-gray-300: #444444;
    --color-gray-400: #666666;
    --color-white: #1f2121;
    --color-black: #ffffff;
}

.light-theme .site-header {
    background-color: #f8f8f8;
    border-bottom: 1px solid #e0e0e0;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

.light-theme .mobile-nav {
    background-color: #f8f8f8;
}

.light-theme .header-brand,
.light-theme .text-link,
.light-theme .dropdown-btn,
.light-theme .mobile-nav-item {
    color: #1f2121;
}

.light-theme .dropdown-btn {
    border-color: #cccccc;
}

.light-theme .dropdown-btn:hover {
    background: #e8e8e8;
}