<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}Olé Consulting{% endblock %}</title>
    
    <!-- Favicon -->
    <link rel="apple-touch-icon" sizes="180x180" href="{{ url_for('static', filename='img/apple-touch-icon.png') }}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ url_for('static', filename='img/favicon-32x32.png') }}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ url_for('static', filename='img/favicon-16x16.png') }}">
    <link rel="manifest" href="{{ url_for('static', filename='img/site.webmanifest') }}">
    
    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@500;600;700&display=swap" rel="stylesheet">
    
    <!-- Font Awesome Icons (para iconos) -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
    
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
    
    <!-- Custom CSS -->
    <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/admin_custom.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/cookie-consent.css') }}">
    {% block styles %}{% endblock %}
    <script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
</head>
<body>
    <header>
        <div class="container">
            <nav class="navbar navbar-expand-lg navbar-light">
                <a class="navbar-brand" href="{{ url_for('public.home') }}">
                    <img src="{{ url_for('static', filename='img/LOGO-OLE-CONTULTING-COLOR.png') }}" alt="Olé Consulting Logo" class="d-inline-block align-top">
                </a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarNav">
                    <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
                        <li class="nav-item">
                            <a class="nav-link" href="{{ url_for('public.home') }}">Inicio</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="{{ url_for('invoice.estudio_gratuito') }}">Estudio Gratis</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="{{ url_for('blog.list_articles') }}">Blog</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="{{ url_for('contact_bp.contact') }}">Contacto</a>
                        </li>
                        {% if current_user.is_authenticated %}
                            <li class="nav-item dropdown">
                                <a class="nav-link dropdown-toggle btn btn-user-nav" href="#" id="userDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                    {% if current_user.profile_image %}
                                        <img src="{{ url_for('static', filename='uploads/profiles/' + current_user.profile_image) }}" alt="Perfil" class="rounded-circle me-2" style="width: 24px; height: 24px; object-fit: cover;">
                                    {% else %}
                                        <i class="fas fa-user-circle me-2"></i>
                                    {% endif %}
                                    {{ current_user.username }}
                                </a>
                                <ul class="dropdown-menu" aria-labelledby="userDropdown">
                                    <li><a class="dropdown-item" href="{{ url_for('admin.index') }}"><i class="fas fa-tachometer-alt me-2"></i>Área de Administración</a></li>
                                    <li><a class="dropdown-item" href="{{ url_for('auth_bp.profile') }}"><i class="fas fa-user me-2"></i>Perfil</a></li>
                                    <li><hr class="dropdown-divider"></li>
                                    <li><a class="dropdown-item text-danger" href="{{ url_for('auth_bp.logout') }}"><i class="fas fa-sign-out-alt me-2"></i>Cerrar sesión</a></li>
                                </ul>
                            </li>
                        {% else %}
                        <li class="nav-item">
                            <a class="nav-link" href="{{ url_for('auth_bp.login') }}">Acceder</a>
                        </li>
                        {% endif %}
                    </ul>
                </div>
            </nav>
        </div>
    </header>

    <main>
        {% block content %}
        <!-- Contenido principal de cada página -->
        {% endblock %}
    </main>

    <footer class="legal-footer">
        <div class="container">
            <div class="footer-content">
                <div class="row">
                    <div class="col-md-4">
                        <h4>Olé Consulting</h4>
                        <p>Tu consultoría energética de confianza</p>
                        <div class="social-icons">
                            <a href="#"><i class="fab fa-facebook-f"></i></a>
                            <a href="#"><i class="fab fa-twitter"></i></a>
                            <a href="https://www.linkedin.com/company/ole-consulting/" target="_blank"><i class="fab fa-linkedin-in"></i></a>
                            <a href="#"><i class="fab fa-instagram"></i></a>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <h4>Enlaces rápidos</h4>
                        <ul class="footer-links">
                            <li><a href="{{ url_for('public.home') }}">Inicio</a></li>
                            <li><a href="{{ url_for('public.home') }}#servicios">Servicios</a></li>
                            <li><a href="{{ url_for('invoice.estudio_gratuito') }}">Estudio Gratuito</a></li>
                            <li><a href="{{ url_for('public.home') }}#partners">Partners</a></li>
                        </ul>
                    </div>
                    <div class="col-md-4">
                        <h4>Contacto</h4>
                        <ul class="footer-contact">
                            <li><i class="fas fa-map-marker-alt"></i> C/ de la Princesa 31, 2-2, 28008, Madrid</li>
                            <li><i class="fas fa-phone"></i> +34 919 99 30 76</li>
                            <li><i class="fab fa-whatsapp"></i> +34 641 13 81 84</li>
                            <li><i class="fas fa-envelope"></i> ahorro@oleconsulting.es</li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="footer-bottom">
                <div class="row">
                    <div class="col-md-6">
                        <p>&copy; 2025 Olé Consulting. Todos los derechos reservados.</p>
                    </div>
                    <div class="col-md-6 text-md-end">
                        <ul class="legal-links">
                            <li><a href="{{ url_for('public.privacy_policy') }}">Política de privacidad</a></li>
                            <li><a href="{{ url_for('public.cookies_policy') }}">Política de cookies</a></li>
                            <li><a href="{{ url_for('public.terms_conditions') }}">Aviso legal</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </footer>

    <!-- Bootstrap JS (Bundle with Popper) -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
    <!-- Custom JS (main.js) -->
    <script src="{{ url_for('static', filename='js/main.js') }}"></script>

    <!-- Cookie Consent JS -->

    {% block scripts %}{% endblock %} {# For page-specific additional scripts #}

    <!-- Script para el manejo de consentimiento de cookies -->
    <script src="{{ url_for('static', filename='js/cookie-consent.js') }}" defer></script>
    
    <!-- Script para la carga condicional de scripts basada en el consentimiento -->
    <script src="{{ url_for('static', filename='js/conditional-scripts.js') }}" defer></script>
    
    <!-- El sistema de cookies ahora se maneja completamente desde JavaScript -->
    <!-- Los scripts de análisis y marketing se cargan/descargan dinámicamente según el consentimiento -->
</body>
</html>
