/*
Theme Name: DuskFlick Dark
Template: twentytwentyfive
Description: Dark entertainment theme for DuskFlick
Version: 1.0.5
*/

:root {
    --bg-primary: #0a0a0f;
    --bg-secondary: #111118;
    --bg-card: #1a1a24;
    --bg-elevated: #222230;
    --text-primary: #f0f0f5;
    --text-secondary: #a0a0b0;
    --text-muted: #6a6a78;
    --accent-1: #667eea;
    --accent-2: #764ba2;
    --accent-3: #f5576c;
    --accent-4: #4facfe;
    --accent-cta: #ff6b35;
    --border: rgba(255,255,255,0.06);
    --radius: 12px;
}

body, html, .wp-site-blocks, .site-header, header, .wp-block-template-part {
    background-color: #0a0a0f !important;
    color: #f0f0f5 !important;
}

.site-header {
    background: rgba(10,10,15,0.92) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
}

.main-nav a, .wp-block-navigation a, nav a { color: #a0a0b0 !important; text-decoration: none !important; font-weight: 500 !important; }
.main-nav a:hover, .wp-block-navigation a:hover, nav a:hover { color: #667eea !important; }

.wp-block-site-title a { color: #f0f0f5 !important; font-weight: 800 !important; font-size: 1.5rem !important; }
h1, h2, h3, h4, h5, h6, .wp-block-heading { color: #f0f0f5 !important; }
p, .wp-block-paragraph { color: #a0a0b0 !important; }
a { color: #4facfe !important; text-decoration: none !important; }
a:hover { color: #667eea !important; }

.wp-block-button__link, .wp-element-button {
    background: linear-gradient(135deg, #ff6b35, #f7931e) !important;
    color: white !important; border: none !important; border-radius: 8px !important;
    padding: 0.75rem 1.5rem !important; font-weight: 600 !important;
}
.wp-block-button__link:hover, .wp-element-button:hover { opacity: 0.9 !important; }
.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent !important; color: #ff6b35 !important; border: 1px solid #ff6b35 !important;
}

.site-footer, footer { background-color: #111118 !important; border-top: 1px solid rgba(255,255,255,0.06) !important; color: #6a6a78 !important; }

.gradient-text {
    background: linear-gradient(135deg, #667eea, #764ba2, #f5576c);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

/* ===== TRENDING CARDS ===== */
.wp-block-post-template {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.5rem !important;
    list-style: none !important;
    padding: 0 !important;
}

.wp-block-post {
    background-color: #1a1a24 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    transition: transform 0.2s, box-shadow 0.2s !important;
}
.wp-block-post:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.3) !important;
}

/* Card image wrapper - fallback gradient when no featured image */
.card-image-wrapper {
    position: relative !important;
    height: 180px !important;
    background: linear-gradient(135deg, #ff6b35, #f7931e) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 3rem !important;
}

/* When there IS a featured image, remove the gradient and emoji */
.card-image-wrapper .wp-block-post-featured-image {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}
.card-image-wrapper .wp-block-post-featured-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
.card-image-wrapper:has(.wp-block-post-featured-image img[src]) {
    background: none !important;
}

/* Gradient overlays for visual interest */
.card-image-wrapper::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, transparent 50%, rgba(0,0,0,0.1) 100%) !important;
    pointer-events: none !important;
}

/* Category-specific gradients */
.wp-block-post.has-category-entertainment .card-image-wrapper { background: linear-gradient(135deg, #ff6b35, #f7931e) !important; }
.wp-block-post.has-category-technology .card-image-wrapper { background: linear-gradient(135deg, #4facfe, #00f2fe) !important; }
.wp-block-post.has-category-lifestyle .card-image-wrapper { background: linear-gradient(135deg, #f5576c, #ff6b35) !important; }
.wp-block-post.has-category-gaming .card-image-wrapper { background: linear-gradient(135deg, #764ba2, #f5576c) !important; }
.wp-block-post.has-category-wellness .card-image-wrapper { background: linear-gradient(135deg, #2ecc71, #27ae60) !important; }

/* Badge overlay */
.badge-overlay {
    position: absolute !important;
    top: 0.75rem !important;
    left: 0.75rem !important;
    z-index: 10 !important;
    display: inline-block !important;
    padding: 0.2rem 0.8rem !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    border-radius: 20px !important;
    background: rgba(0,0,0,0.6) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    color: #f0f0f5 !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
}
.badge-overlay a { color: #f0f0f5 !important; text-decoration: none !important; }

/* Post card content */
.wp-block-post-title { padding: 0 1.5rem !important; margin-top: 0.75rem !important; }
.wp-block-post-title a { color: #f0f0f5 !important; text-decoration: none !important; font-weight: 600 !important; }
.wp-block-post-excerpt { padding: 0 1.5rem !important; }
.wp-block-post-excerpt__excerpt { color: #a0a0b0 !important; font-size: 0.9rem !important; }
.wp-block-post-date { padding: 0 1.5rem 1rem !important; color: #4facfe !important; font-size: 0.8rem !important; }

.wp-block-post-featured-image { margin: 0 !important; }
.wp-block-post-featured-image img { border-radius: 0 !important; width: 100% !important; height: 180px !important; object-fit: cover !important; }

.wp-block-post-excerpt .wp-block-post-excerpt__more-text { color: #667eea !important; font-weight: 600 !important; }

/* ===== CATEGORIES ===== */
.category-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 1rem !important;
}
.category-item {
    border-radius: 12px !important;
    padding: 1.5rem !important;
    transition: transform 0.2s, box-shadow 0.2s !important;
    cursor: pointer !important;
}
.category-item:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.3) !important;
}
.category-item a {
    color: white !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
}

/* ===== SIDEBAR ===== */
.sidebar-links a { color: #a0a0b0 !important; text-decoration: none !important; font-size: 0.9rem !important; }
.sidebar-links a:hover { color: #667eea !important; }

h3[style*="border-bottom"] { border-bottom: 2px solid #ff6b35 !important; }

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .wp-block-post-template { grid-template-columns: 1fr !important; }
    .category-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ===== MISC ===== */
main, .site-content, .wp-site-blocks { max-width: 1200px !important; margin: 0 auto !important; padding: 2rem 1.5rem !important; }
input[type="search"], input[type="text"], input[type="email"] {
    background-color: #111118 !important; color: #f0f0f5 !important;
    border: 1px solid rgba(255,255,255,0.06) !important; border-radius: 8px !important; padding: 0.75rem 1rem !important;
}
body.admin-bar { margin-top: 32px !important; }