/* Global Theme Styles for Dealinco */
* {
    font-family: 'Plus Jakarta Sans', sans-serif;
    letter-spacing: -0.01em;
}

:root {
    color-scheme: light;
    --primary: #f97316;
    --primary-dark: #ea580c;
    --bg-primary: #f8fafc;
    --bg-secondary: #ffffff;
    --text-primary: #0f172a;
    --text-secondary: #475569;
    --card-surface: #ffffff;
    --card-border: rgba(15, 23, 42, 0.08);
    --muted-surface: #e2e8f0;
}

.light {
    color-scheme: light;
}

.dark {
    color-scheme: dark;
    --bg-primary: #0b1220;
    --bg-secondary: #0f172a;
    --text-primary: #e2e8f0;
    --text-secondary: #94a3b8;
    --card-surface: #0f172a;
    --card-border: rgba(148, 163, 184, 0.2);
    --muted-surface: rgba(148, 163, 184, 0.12);
}

body {
    background: radial-gradient(circle at 20% 20%, rgba(249, 115, 22, 0.08), transparent 45%),
                radial-gradient(circle at 80% 0%, rgba(59, 130, 246, 0.08), transparent 40%),
                var(--bg-primary);
    color: var(--text-primary);
    min-height: 100vh;
    transition: background 0.4s ease, color 0.2s ease;
}

main {
    color: inherit;
}

.expired-deal {
    filter: grayscale(0.2) saturate(0.8);
    opacity: 0.7;
}

/* Filter pills */
.filter-btn {
    background-color: var(--muted-surface);
    color: var(--text-secondary);
    border: 1px solid transparent;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.filter-btn:not(.active):hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
    color: var(--text-primary);
}

.filter-btn.active {
    background-image: linear-gradient(135deg, var(--primary), var(--primary-dark));
    color: #ffffff;
    border-color: transparent;
    box-shadow: 0 12px 25px rgba(249, 115, 22, 0.35);
}

.dark .filter-btn {
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.15);
}

.dark .filter-btn:not(.active):hover {
    color: #f8fafc;
    box-shadow: 0 10px 28px rgba(2, 6, 23, 0.7);
}

/* Category badges (index-v2) */
.category-badge {
    color: var(--text-primary);
}

.category-badge.active {
    color: #ffffff;
}

.dark .category-badge {
    color: #e2e8f0;
}

.dark .category-badge:not(.active):hover {
    color: #ffffff;
}

/* Deal cards */
.deal-card {
    background-color: var(--card-surface) !important;
    border: 1px solid var(--card-border);
    box-shadow: 0 15px 40px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(8px);
}

.dark .deal-card {
    box-shadow: 0 25px 60px rgba(2, 6, 23, 0.8);
}

.deal-card h3 {
    color: var(--text-primary);
}

.deal-card p,
.deal-card .meta-muted {
    color: var(--text-secondary) !important;
}

.deal-card .badge-pill {
    background-color: rgba(249, 115, 22, 0.14);
    color: var(--primary);
}

.dark .deal-card .badge-pill {
    background-color: rgba(249, 115, 22, 0.2);
    color: #ffedd5;
}

/* Typographic helpers for better contrast in dark mode */
.dark .text-gray-600,
.dark .text-gray-500,
.dark .text-gray-400 {
    color: #94a3b8 !important;
}

/* Inputs feel more premium in dark mode */
.dark input,
.dark textarea,
.dark select {
    background-color: #0f172a !important;
    border-color: rgba(148, 163, 184, 0.35) !important;
    color: var(--text-primary) !important;
}

.dark input:focus,
.dark textarea:focus,
.dark select:focus {
    border-color: rgba(249, 115, 22, 0.6) !important;
    box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.25);
}

.bg-white\/80 {
    background-color: rgba(255, 255, 255, 0.8);
}

.text-gray-700 {
    --tw-text-opacity: 1;
    color: rgb(51, 65, 85);
}

.dark .text-gray-700 {
    color: #e2e8f0 !important;
}

.nav-login-btn {
    color: #ffffff;
}

.nav-login-btn:hover,
.nav-login-btn:focus {
    color: #ffffff;
}