/*
Theme Name: Fajaede Child Theme
Theme URI: https://fajaede.nl
Template: twentytwentyfour
Version: 1.2.0
Author: Fajaede Team
Description: Professioneel child theme voor fajaede.nl met hero sectie, dropdowns en custom styling
Text Domain: fajaede-child
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* ============================================
   WAARSCHUWING: Gebruik GEEN @import voor parent styles!
   Die worden geladen via functions.php
   ============================================ */

/* ============================================
   FAJAEDE.NL CUSTOM STYLES
   ============================================ */

/* Zichtbare indicator dat child theme werkt */
body.fajaede-child-theme::before {
    content: "🎯 FAJAEDE CHILD THEME ACTIEF";
    position: fixed;
    top: 10px;
    right: 10px;
    background: linear-gradient(135deg, #6a11cb, #2575fc);
    color: white;
    padding: 8px 15px;
    border-radius: 5px;
    z-index: 9999;
    font-size: 12px;
    font-weight: bold;
    box-shadow: 0 3px 10px rgba(0,0,0,0.2);
    display: none; /* Zet dit op 'none' voor productie, of 'block' om te testen */
}

/* 1. Hero Sectie */
.fajaede-hero {
    background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
    color: white;
    padding: 100px 20px;
    border-radius: 25px;
    margin: 40px auto;
    max-width: 1200px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 25px 50px rgba(106, 17, 203, 0.15);
}

/* 2. Dropdown Menus */
.sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    min-width: 280px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12);
    border-radius: 16px;
    padding: 12px 0;
    z-index: 9999;
}

/* 3. Downloads Styling */
.download-category {
    background: linear-gradient(145deg, #ffffff, #f5f7fa);
    border-radius: 20px;
    padding: 30px;
    box-shadow: 8px 8px 16px #e1e5eb, -8px -8px 16px #ffffff;
}

/* 4. Sidebar Styling */
.fajaede-sidebar {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

/* 5. Responsive */
@media (max-width: 768px) {
    .fajaede-hero {
        flex-direction: column;
        text-align: center;
        padding: 60px 20px;
    }

    /* Verberg sidebar op mobiel */
    #secondary {
        display: none !important;
    }
}