{% load pdf_tags %}
<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="utf-8">
    <title>{{ title }} - {{ corporate_settings.stiftung_name }}</title>
    <style>
        @page {
            size: A4;
            margin: 2cm 1.5cm 2cm 1.5cm;
            @bottom-center {
                content: "Seite " counter(page) " von " counter(pages);
                font-size: 10pt;
                color: #666;
            }
        }
        
        body {
            font-family: 'Segoe UI', 'DejaVu Sans', Arial, sans-serif;
            font-size: 10pt;
            line-height: 1.4;
            color: #333;
            margin: 0;
            padding: 0;
        }
        
        .header {
            border-bottom: 2px solid {{ corporate_settings.primary_color|default:"#2c3e50" }};
            padding-bottom: 15px;
            margin-bottom: 25px;
            page-break-inside: avoid;
        }
        
        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
        }
        
        .header-left {
            flex: 1;
        }
        
        .header-right {
            text-align: right;
            flex-shrink: 0;
            margin-left: 20px;
        }
        
        .logo {
            max-height: 60px;
            max-width: 150px;
            margin-bottom: 10px;
        }
        
        .stiftung-name {
            font-size: 20pt;
            font-weight: bold;
            color: {{ corporate_settings.primary_color|default:"#2c3e50" }};
            margin: 0;
            line-height: 1.2;
        }
        
        .document-title {
            font-size: 16pt;
            color: {{ corporate_settings.secondary_color|default:"#3498db" }};
            margin: 5px 0 0 0;
        }
        
        .header-info {
            font-size: 9pt;
            color: #666;
            margin-top: 10px;
        }
        
        .contact-info {
            font-size: 8pt;
            color: #666;
            line-height: 1.3;
        }
        
        h1, h2, h3 {
            color: {{ corporate_settings.primary_color|default:"#2c3e50" }};
            page-break-inside: avoid;
            page-break-after: avoid;
        }
        
        h1 {
            font-size: 14pt;
            margin: 20px 0 15px 0;
            border-bottom: 1px solid {{ corporate_settings.secondary_color|default:"#3498db" }};
            padding-bottom: 5px;
        }
        
        h2 {
            font-size: 12pt;
            margin: 15px 0 10px 0;
        }
        
        table {
            width: 100%;
            border-collapse: collapse;
            margin: 10px 0;
            page-break-inside: avoid;
            font-size: 9pt;
        }
        
        th, td {
            border: 1px solid #ddd;
            padding: 4px 6px;
            text-align: left;
            vertical-align: top;
        }
        
        th {
            background-color: #f8f9fa;
            font-weight: 600;
            color: {{ corporate_settings.primary_color|default:"#2c3e50" }};
            font-size: 8pt;
        }
        
        tr:nth-child(even) {
            background-color: #f9f9f9;
        }
        
        .amount {
            text-align: right;
            font-family: 'Courier New', monospace;
            font-weight: 500;
        }
        
        .status-badge {
            padding: 2px 4px;
            border-radius: 3px;
            font-size: 7pt;
            font-weight: 500;
        }
        
        .status-beantragt { background-color: #fff3cd; color: #856404; }
        .status-genehmigt { background-color: #d1ecf1; color: #0c5460; }
        .status-ausgezahlt { background-color: #d4edda; color: #155724; }
        .status-abgelehnt { background-color: #f8d7da; color: #721c24; }
        .status-storniert { background-color: #e2e3e5; color: #383d41; }
        
        .footer {
            margin-top: 30px;
            padding-top: 15px;
            border-top: 1px solid #ddd;
            font-size: 8pt;
            color: #666;
            text-align: center;
        }
        
        .stats-summary {
            background-color: #f8f9fa;
            border: 1px solid #ddd;
            border-radius: 4px;
            padding: 10px;
            margin: 15px 0;
        }
        
        .section {
            margin-bottom: 20px;
            page-break-inside: avoid;
        }
    </style>
</head>
<body>
    <!-- Header Section -->
    <div class="header">
        <div class="header-content">
            <div class="header-left">
                {% if logo_base64 %}
                <img src="{{ logo_base64 }}" alt="{{ corporate_settings.stiftung_name }} Logo" class="logo">
                {% endif %}
                <h1 class="stiftung-name">{{ corporate_settings.stiftung_name }}</h1>
                <div class="document-title">{{ title }}</div>
                <div class="header-info">
                    Erstellt am: {{ generation_date|date:"d.m.Y H:i" }}
                    {% if generated_by %} | Erstellt von: {{ generated_by }}{% endif %}
                    {% if total_count %} | Anzahl Einträge: {{ total_count }}{% endif %}
                </div>
            </div>
            
            {% if corporate_settings.address_line1 or corporate_settings.phone or corporate_settings.email %}
            <div class="header-right">
                <div class="contact-info">
                    {% if corporate_settings.address_line1 %}
                        {{ corporate_settings.address_line1 }}<br>
                    {% endif %}
                    {% if corporate_settings.address_line2 %}
                        {{ corporate_settings.address_line2 }}<br>
                    {% endif %}
                    {% if corporate_settings.phone %}
                        Tel: {{ corporate_settings.phone }}<br>
                    {% endif %}
                    {% if corporate_settings.email %}
                        E-Mail: {{ corporate_settings.email }}<br>
                    {% endif %}
                    {% if corporate_settings.website %}
                        Web: {{ corporate_settings.website }}
                    {% endif %}
                </div>
            </div>
            {% endif %}
        </div>
    </div>
    
    <!-- Summary Section -->
    {% if total_count %}
    <div class="stats-summary">
        <strong>Zusammenfassung:</strong> {{ total_count }} Eintrag{{ total_count|pluralize:"e" }} exportiert
    </div>
    {% endif %}
    
    <!-- Data Table -->
    {% if data %}
    <div class="section">
        <table>
            <thead>
                <tr>
                    {% for field_key, field_display in fields_config.items %}
                    <th>{{ field_display }}</th>
                    {% endfor %}
                </tr>
            </thead>
            <tbody>
                {% for item in data %}
                <tr>
                    {% for field_key, field_display in fields_config.items %}
                    <td>
                        {% if field_key == 'betrag' or field_key == 'pachtzins' or 'betrag' in field_key %}
                            <span class="amount">
                                {% if item|lookup:field_key %}€{{ item|lookup:field_key|floatformat:2 }}{% else %}-{% endif %}
                            </span>
                        {% elif field_key == 'status' %}
                            {% with status_value=item|lookup:field_key %}
                                {% if status_value %}
                                    <span class="status-badge status-{{ status_value }}">{{ status_value|capfirst }}</span>
                                {% else %}-{% endif %}
                            {% endwith %}
                        {% elif field_key|slice:"-5:" == '_date' or field_key|slice:"-6:" == '_datum' or 'datum' in field_key or 'date' in field_key %}
                            {% with date_value=item|lookup:field_key %}
                                {% if date_value %}{{ date_value|date:"d.m.Y" }}{% else %}-{% endif %}
                            {% endwith %}
                        {% else %}
                            {% with field_value=item|lookup:field_key %}
                                {{ field_value|default:"-"|truncatechars:50 }}
                            {% endwith %}
                        {% endif %}
                    </td>
                    {% endfor %}
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
    {% else %}
    <div class="section">
        <p><em>Keine Daten zum Anzeigen verfügbar.</em></p>
    </div>
    {% endif %}
    
    <!-- Footer Section -->
    <div class="footer">
        {% if corporate_settings.footer_text %}
            <p>{{ corporate_settings.footer_text }}</p>
        {% endif %}
        <p>{{ corporate_settings.stiftung_name }} | Generiert am {{ generation_date|date:"d.m.Y H:i" }}</p>
    </div>
</body>
</html>
