:root {
    --theme-primary: #dc3545;
    --theme-secondary: #6c757d;
    --theme-accent: #ffc107;
    --theme-success: #28a745;
    --header-bg: #dc3545;
    --header-text: #ffffff;
    --header-link: #ffffff;
    --header-link-hover: #f8d7da;
    --footer-bg: #212529;
    --footer-text: #adb5bd;
    --footer-link: #ffffff;
    --footer-heading: #ffffff;
    --body-bg: #f8f9fa;
    --body-text: #212529;
    --link-color: #dc3545;
    --link-hover: #c82333;
    --card-bg: #ffffff;
    --card-border: #dee2e6;
    --card-title: #212529;
    --card-text: #6c757d;
    --hero-bg: #dc3545;
    --hero-text: #ffffff;
    --hero-overlay: rgba(220,53,69,0.9);
    --btn-primary-bg: #dc3545;
    --btn-primary-text: #ffffff;
    --btn-primary-hover: #c82333;
    --rating-star: #ffc107;
    --badge-easy: #28a745;
    --badge-medium: #ffc107;
    --badge-hard: #dc3545;
    --border-radius: 8px;
    --card-radius: 12px;
    --btn-radius: 6px;
}

body {
    background-color: var(--body-bg);
    color: var(--body-text);
}

a { color: var(--link-color); }
a:hover { color: var(--link-hover); }

.navbar.bg-primary {
    background-color: var(--header-bg) !important;
}
.navbar .navbar-brand,
.navbar .nav-link {
    color: var(--header-link) !important;
}
.navbar .nav-link:hover {
    color: var(--header-link-hover) !important;
}

footer.bg-dark {
    background-color: var(--footer-bg) !important;
}
footer .text-light,
footer .text-secondary {
    color: var(--footer-text) !important;
}
footer a {
    color: var(--footer-link) !important;
}
footer h6 {
    color: var(--footer-heading) !important;
}

.hero-section {
    background: linear-gradient(135deg, var(--hero-bg), #c82131);
    color: var(--hero-text);
}

.btn-primary {
    background-color: var(--btn-primary-bg);
    border-color: var(--btn-primary-bg);
    color: var(--btn-primary-text);
    border-radius: var(--btn-radius);
}
.btn-primary:hover {
    background-color: var(--btn-primary-hover);
    border-color: var(--btn-primary-hover);
}

.recipe-card,
.card {
    background-color: var(--card-bg);
    border-color: var(--card-border);
    border-radius: var(--card-radius);
}
.recipe-card-title,
.card-title {
    color: var(--card-title);
}
.recipe-card .text-muted,
.card-text {
    color: var(--card-text);
}

.category-card.breakfast { background: linear-gradient(135deg, #f39c12, #e48d03); }
.category-card.lunch { background: linear-gradient(135deg, #27ae60, #189f51); }
.category-card.dinner { background: linear-gradient(135deg, #8e44ad, #7f359e); }
.category-card.dessert { background: linear-gradient(135deg, #e74c3c, #d83d2d); }
.category-card.snacks { background: linear-gradient(135deg, #3498db, #2589cc); }
.category-card.drinks { background: linear-gradient(135deg, #1abc9c, #0bad8d); }

.rating-stars .fa-star { color: var(--rating-star); }
.difficulty-easy { background-color: var(--badge-easy); }
.difficulty-medium { background-color: var(--badge-medium); color: #212529; }
.difficulty-hard { background-color: var(--badge-hard); }

.rounded-4 { border-radius: var(--card-radius) !important; }

[data-theme="dark"] {
    --body-bg: #1a1a2e;
    --body-text: #e4e4e4;
    --card-bg: #16213e;
    --card-text: #e4e4e4;
    --card-title: #e4e4e4;
    --header-bg: #0f0f23;
    --footer-bg: #0f0f23;
}

[data-theme="dark"] body,
body.dark-mode {
    background-color: #1a1a2e;
    color: #e4e4e4;
}

[data-theme="dark"] .navbar.bg-primary,
body.dark-mode .navbar.bg-primary {
    background-color: #0f0f23 !important;
}

[data-theme="dark"] footer.bg-dark,
body.dark-mode footer.bg-dark {
    background-color: #0f0f23 !important;
}

[data-theme="dark"] .recipe-card,
[data-theme="dark"] .card,
[data-theme="dark"] .bg-white,
body.dark-mode .recipe-card,
body.dark-mode .card,
body.dark-mode .bg-white {
    background-color: #16213e !important;
    color: #e4e4e4;
}

[data-theme="dark"] .recipe-card-title,
[data-theme="dark"] .card-title,
body.dark-mode .recipe-card-title,
body.dark-mode .card-title {
    color: #e4e4e4;
}

[data-theme="dark"] .sidebar-widget,
body.dark-mode .sidebar-widget {
    background-color: #16213e;
    color: #e4e4e4;
}

[data-theme="dark"] .list-group-item,
body.dark-mode .list-group-item {
    background-color: #16213e;
    color: #e4e4e4;
    border-color: rgba(255,255,255,0.1);
}

