{% extends 'base.html' %}
{% block title %}Einstellungen | Filament Manager{% endblock %}
{% block head_extra %}
<link rel="modulepreload" href="{{ url_for('static', filename='js/settings.js') }}">
<link rel="modulepreload" href="{{ url_for('static', filename='js/modules/settings_core.js') }}">
{% endblock %}
{% block body_class %}page-settings{% endblock %}
{% block page_title %}Einstellungen{% endblock %}
{% block page_subtitle %}Systemsteuerung fuer Filamentverwaltung, Datenpfade, Service-Tools und Backup/Import.{% endblock %}
{% block page_toolbar %}
<details class="row-action-menu page-toolbar-menu">
  <summary class="sci-btn small row-action-menu-trigger">
    <iconify-icon icon="mdi:view-dashboard-outline" aria-hidden="true"></iconify-icon> Bereiche
    <iconify-icon class="menu-caret" icon="mdi:chevron-down" aria-hidden="true"></iconify-icon>
  </summary>
  <div class="row-action-menu-list page-toolbar-menu-list">
    <div class="row-action-menu-head">Schnellwechsel</div>
    <div class="row-action-menu-note muted tiny">Die grossen Einstellungsbereiche koennen direkt aus dem Kopfmenue gewechselt werden.</div>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="general"><iconify-icon icon="mdi:view-dashboard-outline" aria-hidden="true"></iconify-icon> Basis</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="display"><iconify-icon icon="mdi:palette-outline" aria-hidden="true"></iconify-icon> Anzeige</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="language"><iconify-icon icon="mdi:translate" aria-hidden="true"></iconify-icon> Sprache & Land</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="labels"><iconify-icon icon="mdi:label-outline" aria-hidden="true"></iconify-icon> Label</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="printer3d"><iconify-icon icon="mdi:printer-3d-nozzle-outline" aria-hidden="true"></iconify-icon> 3D Drucker</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="label-printer"><iconify-icon icon="mdi:printer-outline" aria-hidden="true"></iconify-icon> Label Drucker</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="reports"><iconify-icon icon="mdi:chart-box-outline" aria-hidden="true"></iconify-icon> Reports</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="tools"><iconify-icon icon="mdi:tune-variant" aria-hidden="true"></iconify-icon> Tools</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="debug"><iconify-icon icon="mdi:bug-outline" aria-hidden="true"></iconify-icon> Debug</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="backup"><iconify-icon icon="mdi:database-outline" aria-hidden="true"></iconify-icon> Sichern</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="updates"><iconify-icon icon="mdi:update" aria-hidden="true"></iconify-icon> Updates</button>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-settings-tab-shortcut="version"><iconify-icon icon="mdi:information-outline" aria-hidden="true"></iconify-icon> Version</button>
  </div>
</details>
<details class="row-action-menu page-toolbar-menu">
  <summary class="sci-btn small row-action-menu-trigger">
    <iconify-icon icon="mdi:content-save-outline" aria-hidden="true"></iconify-icon> Aktionen
    <iconify-icon class="menu-caret" icon="mdi:chevron-down" aria-hidden="true"></iconify-icon>
  </summary>
  <div class="row-action-menu-list page-toolbar-menu-list">
    <div class="row-action-menu-head">Backup und Hilfe</div>
    <div class="row-action-menu-note muted tiny">Wichtige Service-Aktionen und Hilfeseiten fuer Tests und Datensicherung.</div>
    <a class="sci-btn subtle small menu-action-btn" href="{{ url_for('web.settings_backup_export_sqlite', mode='full') }}"><iconify-icon icon="mdi:database-arrow-up-outline" aria-hidden="true"></iconify-icon> SQLite Sicherung</a>
    <button type="button" class="sci-btn subtle small menu-action-btn" data-open-global-bug-tracker><iconify-icon icon="mdi:bug-outline" aria-hidden="true"></iconify-icon> Feedback</button>
    <a class="sci-btn subtle small menu-action-btn" href="{{ url_for('web.wiki') }}"><iconify-icon icon="mdi:book-open-page-variant-outline" aria-hidden="true"></iconify-icon> Wiki</a>
  </div>
</details>
{% endblock %}
{% block content %}
{% set settings_profile_name = settings.community_profile_name or settings.company_name or 'Nexus Test User' %}
{% set settings_profile_initial = (settings_profile_name[:1] or 'N')|upper %}
{% set settings_profile_avatar_url = settings.community_profile_avatar_url or '' %}
{% set settings_profile_public_id = settings.community_profile_public_id or '--------' %}
{% set settings_gamification = community_stats.gamification if community_stats and community_stats.get('gamification') else {} %}
{% set settings_language_label = 'Deutsch' %}
{% if settings.ui_language == 'en' %}
  {% set settings_language_label = 'English' %}
{% elif settings.ui_language == 'fr' %}
  {% set settings_language_label = 'Francais' %}
{% endif %}
<section class="sci-panel settings-panel settings-panel--windows">
  <div class="settings-tab-shell" data-settings-tabs>
    <aside class="settings-sidebar-shell">
      <section class="settings-profile-card">
        <div class="settings-profile-avatar" aria-hidden="true">
          {% if settings_profile_avatar_url %}
          <img src="{{ settings_profile_avatar_url }}" alt="{{ settings_profile_name }}">
          {% else %}
          {{ settings_profile_initial }}
          {% endif %}
        </div>
        <div class="settings-profile-copy">
          <strong>{{ settings_profile_name }}</strong>
          <span>ID {{ settings_profile_public_id }} | {{ settings_language_label }} | {{ (settings.ui_theme_default or 'light')|upper }} Theme</span>
          <small>Rang {{ settings_gamification.rank_label or community_stats.last_rank_label or 'Community Starter' }} | Level {{ settings_gamification.level or 1 }} | {{ settings_gamification.total_xp or community_stats.xp_total or 0 }} XP</small>
        </div>
      </section>

      <div class="settings-quick-search">
        <label class="settings-search-label" for="settings-search-input">Einstellung suchen</label>
        <input id="settings-search-input" class="sci-input" type="search" data-settings-search placeholder="Einstellungen durchsuchen (z.B. MQTT, Backup, Bundle, Firmware)">
        <div class="muted tiny" data-settings-search-status>Suche aktiv nur in der aktuell geoeffneten Tab-Seite.</div>
      </div>

      <nav class="settings-tab-nav-main" aria-label="Einstellungen Tabs">
        <button
          type="button"
          class="settings-tab-btn active"
          data-settings-tab="general"
          data-settings-title="Basis Einstellungen"
          data-settings-lead="Systemgrundlagen, Firma, Lagergrenzen und MQTT Basisparameter."
          data-settings-breadcrumb="System > Basis"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:view-dashboard-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Basis Einstellungen</strong>
            <small>System und MQTT</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="display"
          data-settings-title="Anzeige und Design"
          data-settings-lead="Theme, Dichte und visuelle UI-Voreinstellungen zentral steuern."
          data-settings-breadcrumb="System > Anzeige"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:palette-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Anzeige und Design</strong>
            <small>Theme, Dichte und UI Look</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="language"
          data-settings-title="Sprache und Land"
          data-settings-lead="Sprach- und Waehrungseinstellungen sowie Land-/Locale-Vorgaben."
          data-settings-breadcrumb="System > Sprache & Land"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:translate" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Sprache & Land</strong>
            <small>Sprache, Locale, Waehrung</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="labels"
          data-settings-title="Labeleinstellungen"
          data-settings-lead="Vorgaben fuer Labelvorlagen, QR-Groesse und Druckinhalte."
          data-settings-breadcrumb="System > Label"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:label-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Labeleinstellungen</strong>
            <small>Label Defaults und QR</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="printer3d"
          data-settings-title="3D Drucker Einstellungen"
          data-settings-lead="3D Drucker, Waagen, Controller und Trockner konfigurieren."
          data-settings-breadcrumb="System > 3D Drucker"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:printer-3d-nozzle-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>3D Drucker</strong>
            <small>Geraete und Verbindungen</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="label-printer"
          data-settings-title="Label Druckereinstellungen"
          data-settings-lead="Labeldruckerprofil mit DPI, Medienbreite und Schneideverhalten."
          data-settings-breadcrumb="System > Label Drucker"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:printer-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Label Drucker</strong>
            <small>Hardwareprofil Labeldruck</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="reports"
          data-settings-title="Report Einstellungen"
          data-settings-lead="PDF Report Defaults und direkte Exporte fuer Lager und Spulen."
          data-settings-breadcrumb="System > Reports"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:chart-box-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Report Einstellungen</strong>
            <small>PDF Optionen und Exporte</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="tools"
          data-settings-title="Tools und Helfer"
          data-settings-lead="Service-Werkzeuge, Diagnose, Runner und Helferfunktionen."
          data-settings-breadcrumb="System > Tools"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:tune-variant" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Tools & Helfer</strong>
            <small>Diagnose und Support</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="debug"
          data-settings-title="Debug Einstellungen"
          data-settings-lead="Browser-Diagnose, Long Tasks, Soft-Navigation und zentrale Tabellenansichten."
          data-settings-breadcrumb="System > Debug"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:bug-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Debug Einstellungen</strong>
            <small>Diagnose, Navigation, Views</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="backup"
          data-settings-title="Sichern und Wiederherstellen"
          data-settings-lead="Backups, Import und Wiederherstellung zentral an einer Stelle."
          data-settings-breadcrumb="System > Backup"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:database-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Sichern & Wiederherstellen</strong>
            <small>Backup und Restore</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="updates"
          data-settings-title="Updates"
          data-settings-lead="Release-Informationen und Update-Hinweise."
          data-settings-breadcrumb="System > Updates"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:update" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Updates</strong>
            <small>Release und Upgrade</small>
          </span>
        </button>
        <button
          type="button"
          class="settings-tab-btn"
          data-settings-tab="version"
          data-settings-title="Version"
          data-settings-lead="Aktuelle Versionsstaende fuer App, Assets und Laufzeit."
          data-settings-breadcrumb="System > Version"
        >
          <span class="settings-tab-btn-icon"><iconify-icon icon="mdi:information-outline" aria-hidden="true"></iconify-icon></span>
          <span class="settings-tab-btn-copy">
            <strong>Version</strong>
            <small>Build und Runtime Infos</small>
          </span>
        </button>
      </nav>

    </aside>

    <div class="settings-content-shell">
      <header class="settings-content-hero">
        <div class="settings-content-breadcrumb" data-settings-active-breadcrumb>System &gt; Basis</div>
        <h2 class="settings-content-title" data-settings-active-title>Basis Einstellungen</h2>
        <p class="settings-content-lead" data-settings-active-lead>Systemgrundlagen, Lagergrenzen und MQTT-Basiswerte.</p>
        <div class="settings-content-shortcuts">
          <button type="button" class="settings-hero-shortcut active" data-settings-tab-shortcut="general"><iconify-icon icon="mdi:view-dashboard-outline" aria-hidden="true"></iconify-icon> Basis</button>
          <button type="button" class="settings-hero-shortcut" data-settings-tab-shortcut="display"><iconify-icon icon="mdi:palette-outline" aria-hidden="true"></iconify-icon> Anzeige</button>
          <button type="button" class="settings-hero-shortcut" data-settings-tab-shortcut="language"><iconify-icon icon="mdi:translate" aria-hidden="true"></iconify-icon> Sprache</button>
          <button type="button" class="settings-hero-shortcut" data-settings-tab-shortcut="reports"><iconify-icon icon="mdi:chart-box-outline" aria-hidden="true"></iconify-icon> Reports</button>
          <button type="button" class="settings-hero-shortcut" data-settings-tab-shortcut="tools"><iconify-icon icon="mdi:tune-variant" aria-hidden="true"></iconify-icon> Tools</button>
          <button type="button" class="settings-hero-shortcut" data-settings-tab-shortcut="debug"><iconify-icon icon="mdi:bug-outline" aria-hidden="true"></iconify-icon> Debug</button>
          <button type="button" class="settings-hero-shortcut" data-settings-tab-shortcut="backup"><iconify-icon icon="mdi:database-outline" aria-hidden="true"></iconify-icon> Backup</button>
          <button type="button" class="settings-hero-shortcut" data-settings-tab-shortcut="version"><iconify-icon icon="mdi:information-outline" aria-hidden="true"></iconify-icon> Version</button>
        </div>
      </header>

      <div class="settings-content-body">
        <form id="appSettingsForm" class="settings-form-stack" autocomplete="off">
      <section class="settings-tab-pane is-active" data-settings-tab-pane="general" id="settings-tab-general">
        <div class="section-head">
          <h2 class="sci-h2">Basis und Netzwerk</h2>
          <div class="muted">Alle Werte werden in der Datenbank gespeichert.</div>
        </div>

        <section class="settings-group" id="settings-system">
          <h3 class="settings-group-title">System</h3>
          <div class="settings-grid-3">
            <div class="sci-input-group">
              <label>Firmenname</label>
              <input class="sci-input" type="text" name="company_name" value="{{ settings.company_name or '' }}">
            </div>
            <div class="sci-input-group">
              <label>Low Stock Grenze (g)</label>
              <input class="sci-input" type="number" min="1" step="1" name="low_stock_threshold_g" value="{{ settings.low_stock_threshold_g or 300 }}">
            </div>
            <div class="sci-input-group">
              <label>Kritisch Grenze (g)</label>
              <input class="sci-input" type="number" min="0" step="1" name="critical_stock_threshold_g" value="{{ settings.critical_stock_threshold_g or 150 }}">
            </div>
            <div class="sci-input-group">
              <label>Demo-Waage Autostart</label>
              <input type="hidden" name="demo_scale_autostart" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="demo_scale_autostart" value="1" {% if settings.demo_scale_autostart not in ('0', 'false', 'False', '') %}checked{% endif %}>
                Demo-Waage Worker beim App-Start aktivieren
              </label>
            </div>
          </div>
        </section>

        <section class="settings-group" id="settings-mqtt">
          <h3 class="settings-group-title">MQTT</h3>
          <div class="settings-grid-3">
            <div class="sci-input-group">
              <label>Host</label>
              <input class="sci-input" type="text" name="mqtt_host" value="{{ settings.mqtt_host or '' }}" placeholder="z.B. 192.168.1.25">
            </div>
            <div class="sci-input-group">
              <label>Port</label>
              <input class="sci-input" type="number" min="1" max="65535" step="1" name="mqtt_port" value="{{ settings.mqtt_port or 1883 }}">
            </div>
            <div class="sci-input-group">
              <label>Base Topic</label>
              <input class="sci-input" type="text" name="mqtt_base_topic" value="{{ settings.mqtt_base_topic or 'filament/slots' }}" placeholder="filament/slots">
            </div>
            <div class="sci-input-group">
              <label>Username</label>
              <input class="sci-input" type="text" name="mqtt_username" value="{{ settings.mqtt_username or '' }}">
            </div>
            <div class="sci-input-group">
              <label>Password</label>
              <input class="sci-input" type="password" name="mqtt_password" value="{{ settings.mqtt_password or '' }}">
            </div>
          </div>
        </section>

        <div class="dialog-actions">
          <button type="submit" class="sci-btn">Basis speichern</button>
        </div>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="display" id="settings-tab-display">
        <div class="section-head">
          <h2 class="sci-h2">Anzeige und Design</h2>
          <div class="muted">Optik und Darstellung fuer Tabellen, Karten und Dichte.</div>
        </div>
        <section class="settings-group" id="settings-display">
          <h3 class="settings-group-title">UI Darstellung</h3>
          <div class="settings-grid-3">
            <div class="sci-input-group">
              <label>Standard Theme</label>
              <select class="sci-input" name="ui_theme_default">
                <option value="light" {% if settings.ui_theme_default == 'light' %}selected{% endif %}>Light</option>
                <option value="dark" {% if settings.ui_theme_default == 'dark' %}selected{% endif %}>Dark</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>UI Dichte</label>
              <select class="sci-input" name="ui_density">
                <option value="comfortable" {% if (settings.ui_density or 'comfortable') == 'comfortable' %}selected{% endif %}>Komfortabel</option>
                <option value="compact" {% if settings.ui_density == 'compact' %}selected{% endif %}>Kompakt</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Tabellenzeilenhoehe</label>
              <select class="sci-input" name="ui_table_row_height">
                <option value="tight" {% if settings.ui_table_row_height == 'tight' %}selected{% endif %}>Tight</option>
                <option value="normal" {% if (settings.ui_table_row_height or 'normal') == 'normal' %}selected{% endif %}>Normal</option>
                <option value="relaxed" {% if settings.ui_table_row_height == 'relaxed' %}selected{% endif %}>Relaxed</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Kompakte Kartenansicht</label>
              <input type="hidden" name="ui_cards_compact" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="ui_cards_compact" value="1" {% if settings.ui_cards_compact in ('1', 'true', 'True', 'yes', 'on') %}checked{% endif %}>
                Karten mit reduzierten Abstaenden anzeigen
              </label>
            </div>
            <div class="sci-input-group">
              <label>Farb-Badges hervorheben</label>
              <input type="hidden" name="ui_show_color_badges" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="ui_show_color_badges" value="1" {% if settings.ui_show_color_badges not in ('0', 'false', 'False', '') %}checked{% endif %}>
                Farbpunkte in Tabellen und Karten betonen
              </label>
            </div>
          </div>
          <div class="dialog-actions">
            <button type="submit" class="sci-btn">Anzeige speichern</button>
          </div>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="language" id="settings-tab-language">
        <div class="section-head">
          <h2 class="sci-h2">Sprache und Land</h2>
          <div class="muted">Sprach-, Locale- und Waehrungsvorgaben fuer die gesamte App.</div>
        </div>
        <section class="settings-group" id="settings-language-country">
          <h3 class="settings-group-title">Sprache & Land</h3>
          <div class="settings-grid-3">
            <div class="sci-input-group">
              <label>Sprache</label>
              <select class="sci-input" name="ui_language" id="settings-ui-language">
                <option value="de" {% if (settings.ui_language or 'de') == 'de' %}selected{% endif %}>Deutsch</option>
                <option value="en" {% if settings.ui_language == 'en' %}selected{% endif %}>Englisch</option>
                <option value="fr" {% if settings.ui_language == 'fr' %}selected{% endif %}>Franzoesisch</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Locale</label>
              <select class="sci-input" name="ui_locale">
                <option value="de-DE" {% if (settings.ui_locale or 'de-DE') == 'de-DE' %}selected{% endif %}>Deutschland (de-DE)</option>
                <option value="en-US" {% if settings.ui_locale == 'en-US' %}selected{% endif %}>USA (en-US)</option>
                <option value="fr-FR" {% if settings.ui_locale == 'fr-FR' %}selected{% endif %}>Frankreich (fr-FR)</option>
                <option value="de-CH" {% if settings.ui_locale == 'de-CH' %}selected{% endif %}>Schweiz (de-CH)</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Waehrung</label>
              <select class="sci-input" name="ui_currency">
                <option value="EUR" {% if (settings.ui_currency or 'EUR') == 'EUR' %}selected{% endif %}>EUR</option>
                <option value="USD" {% if settings.ui_currency == 'USD' %}selected{% endif %}>USD</option>
                <option value="CHF" {% if settings.ui_currency == 'CHF' %}selected{% endif %}>CHF</option>
                <option value="GBP" {% if settings.ui_currency == 'GBP' %}selected{% endif %}>GBP</option>
              </select>
            </div>
          </div>
          <div class="dialog-actions">
            <button type="submit" class="sci-btn">Sprache & Land speichern</button>
          </div>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="labels" id="settings-tab-labels">
        <div class="section-head">
          <h2 class="sci-h2">Labeleinstellungen</h2>
          <div class="muted">Vorgaben fuer Labelvorlagen, QR-Block und Druckinhalte.</div>
        </div>
        <section class="settings-group" id="settings-labels">
          <h3 class="settings-group-title">Label Defaults</h3>
          <div class="settings-grid-3">
            <div class="sci-input-group">
              <label>Default Template Key</label>
              <input class="sci-input" type="text" name="label_default_template_key" value="{{ settings.label_default_template_key or 'dymo_89x36' }}">
            </div>
            <div class="sci-input-group">
              <label>Default Preset Key</label>
              <input class="sci-input" type="text" name="label_default_preset_key" value="{{ settings.label_default_preset_key or 'standard' }}">
            </div>
            <div class="sci-input-group">
              <label>QR Groesse (mm)</label>
              <input class="sci-input" type="number" min="8" max="60" step="1" name="label_qr_size_mm" value="{{ settings.label_qr_size_mm or 22 }}">
            </div>
            <div class="sci-input-group">
              <label>Logo standardmaessig drucken</label>
              <input type="hidden" name="label_show_logo_default" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="label_show_logo_default" value="1" {% if settings.label_show_logo_default not in ('0', 'false', 'False', '') %}checked{% endif %}>
                Label-Logo beim neuen Druckjob standardmaessig aktivieren
              </label>
            </div>
          </div>
          <div class="dialog-actions">
            <button type="submit" class="sci-btn">Labeleinstellungen speichern</button>
          </div>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="label-printer" id="settings-tab-label-printer">
        <div class="section-head">
          <h2 class="sci-h2">Label Druckereinstellungen</h2>
          <div class="muted">Technische Voreinstellungen fuer Labeldrucker und Medienprofil.</div>
        </div>
        <section class="settings-group" id="settings-label-printer">
          <h3 class="settings-group-title">Label Druckerprofil</h3>
          <div class="settings-grid-3">
            <div class="sci-input-group">
              <label>Druckername</label>
              <input class="sci-input" type="text" name="label_printer_name" value="{{ settings.label_printer_name or '' }}" placeholder="z.B. Zebra GK420d">
            </div>
            <div class="sci-input-group">
              <label>DPI</label>
              <select class="sci-input" name="label_printer_dpi">
                <option value="203" {% if settings.label_printer_dpi == '203' %}selected{% endif %}>203 dpi</option>
                <option value="300" {% if (settings.label_printer_dpi or '300') == '300' %}selected{% endif %}>300 dpi</option>
                <option value="600" {% if settings.label_printer_dpi == '600' %}selected{% endif %}>600 dpi</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Papierbreite (mm)</label>
              <input class="sci-input" type="number" min="20" max="120" step="1" name="label_printer_paper_width_mm" value="{{ settings.label_printer_paper_width_mm or 62 }}">
            </div>
            <div class="sci-input-group">
              <label>Auto-Cut aktivieren</label>
              <input type="hidden" name="label_printer_auto_cut" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="label_printer_auto_cut" value="1" {% if settings.label_printer_auto_cut in ('1', 'true', 'True', 'yes', 'on') %}checked{% endif %}>
                Label nach Druck automatisch schneiden
              </label>
            </div>
          </div>
          <div class="dialog-actions">
            <button type="submit" class="sci-btn">Label Drucker speichern</button>
          </div>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="reports" id="settings-tab-reports">
        <div class="section-head">
          <h2 class="sci-h2">Report Einstellungen</h2>
          <div class="muted">PDF Reports fuer Lagerstatus, Rollenvorrat und Bestellzettel steuern.</div>
        </div>
        <section class="settings-group" id="settings-reports">
          <h3 class="settings-group-title">PDF Report Defaults</h3>
          <div class="settings-grid-3">
            <div class="sci-input-group">
              <label>Ausrichtung</label>
              <select class="sci-input" name="report_pdf_orientation">
                <option value="landscape" {% if (settings.report_pdf_orientation or 'landscape') == 'landscape' %}selected{% endif %}>Landscape</option>
                <option value="portrait" {% if settings.report_pdf_orientation == 'portrait' %}selected{% endif %}>Portrait</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Report Bereich</label>
              <select class="sci-input" name="report_default_scope">
                <option value="active" {% if (settings.report_default_scope or 'active') == 'active' %}selected{% endif %}>Nur aktive Daten</option>
                <option value="all" {% if settings.report_default_scope == 'all' %}selected{% endif %}>Alle Daten inkl. archiviert</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Zielbestand fuer Bestellzettel (g)</label>
              <input class="sci-input" type="number" min="200" max="5000" step="50" name="report_low_stock_target_g" value="{{ settings.report_low_stock_target_g or 1000 }}">
            </div>
            <div class="sci-input-group">
              <label>Low Stock Gruppengrenze (g)</label>
              <input class="sci-input" type="number" min="100" max="5000" step="50" name="report_low_stock_group_threshold_g" value="{{ settings.report_low_stock_group_threshold_g or 600 }}">
            </div>
            <div class="sci-input-group">
              <label>Low Stock Logik</label>
              <select class="sci-input" name="low_stock_logic_mode">
                <option value="grouped_material_color" {% if (settings.low_stock_logic_mode or 'grouped_material_color') == 'grouped_material_color' %}selected{% endif %}>Gruppiert (Hersteller+Material+Farbe)</option>
                <option value="per_spool" {% if settings.low_stock_logic_mode == 'per_spool' %}selected{% endif %}>Einzelspule</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Report Gruppierung</label>
              <select class="sci-input" name="report_group_mode">
                <option value="brand_material_color" {% if (settings.report_group_mode or 'brand_material_color') == 'brand_material_color' %}selected{% endif %}>Hersteller + Material + Farbe</option>
                <option value="brand_material" {% if settings.report_group_mode == 'brand_material' %}selected{% endif %}>Hersteller + Material</option>
                <option value="material_color" {% if settings.report_group_mode == 'material_color' %}selected{% endif %}>Material + Farbe</option>
              </select>
            </div>
            <div class="sci-input-group">
              <label>Kopfzeile (Header)</label>
              <input class="sci-input" type="text" maxlength="140" name="report_header_text" value="{{ settings.report_header_text or 'Nexus Core Lager- und Bestandsreport' }}">
            </div>
            <div class="sci-input-group">
              <label>Fusszeile (Footer)</label>
              <input class="sci-input" type="text" maxlength="140" name="report_footer_text" value="{{ settings.report_footer_text or 'Intern | vertraulich' }}">
            </div>
            <div class="sci-input-group">
              <label>Kosten in Reports</label>
              <input type="hidden" name="report_include_costs" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="report_include_costs" value="1" {% if settings.report_include_costs not in ('0', 'false', 'False', '') %}checked{% endif %}>
                Kostenfelder in Lager-/Rollenreport einblenden
              </label>
            </div>
            <div class="sci-input-group">
              <label>Gruppendetails (Rollenvorrat)</label>
              <input type="hidden" name="report_show_group_details" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="report_show_group_details" value="1" {% if settings.report_show_group_details not in ('0', 'false', 'False', '') %}checked{% endif %}>
                Neben Gruppen auch Spulendetails im Report anzeigen
              </label>
            </div>
            <div class="sci-input-group">
              <label>QR Hinweise in Reports</label>
              <input type="hidden" name="report_include_qr" value="0">
              <label class="check-line compact">
                <input type="checkbox" name="report_include_qr" value="1" {% if settings.report_include_qr in ('1', 'true', 'True', 'yes', 'on') %}checked{% endif %}>
                QR/Scan-Hinweise im Reportkopf aktivieren
              </label>
            </div>
          </div>
          <div class="sci-actions section-gap">
            <a class="sci-btn subtle small" href="{{ url_for('web.report_lagerstatus_pdf') }}">Report Lagerstatus (PDF)</a>
            <a class="sci-btn subtle small" href="{{ url_for('web.report_rollenvorrat_pdf') }}">Report Rollenvorrat (PDF)</a>
            <a class="sci-btn subtle small" href="{{ url_for('web.report_bestellzettel_pdf') }}">Report Bestellzettel (PDF)</a>
          </div>
          <div class="muted tiny">Alle Reports nutzen jetzt ein einheitliches Layout mit Kopf-/Fusszeile und automatischem Datumsbereich aus den Daten (von/bis).</div>
          <div class="dialog-actions">
            <button type="submit" class="sci-btn">Report Einstellungen speichern</button>
          </div>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="debug" id="settings-tab-debug">
        <div class="section-head">
          <h2 class="sci-h2">Debug, Diagnose und Ansichten</h2>
          <div class="muted">Zentrale Schaltstelle fuer Browser-Diagnose, Navigation und Tabellenansichten.</div>
        </div>

        <section class="settings-group" id="settings-views">
          <h3 class="settings-group-title">Tabellenansichten zentral</h3>
          <article class="settings-backup-card settings-backup-card--accent">
            <h4>Spool Tabelle</h4>
            <div class="muted tiny">
              Diese Werte gelten app-weit fuer die Spool-Tabellenansicht (sichtbare Spalten + Reihenfolge). Du kannst sie hier zentral setzen statt pro Seite.
            </div>
            <input type="hidden" name="spool_table_columns_json" id="settings-spool-columns-json" value="{{ settings.spool_table_columns_json or '[]' }}">
            <input type="hidden" name="spool_table_column_order_json" id="settings-spool-order-json" value="{{ settings.spool_table_column_order_json or '[]' }}">
            <div class="settings-grid-3 section-gap" id="settings-spool-column-choices"></div>
            <div class="settings-grid-3">
              <div class="sci-input-group">
                <label>Spaltenreihenfolge (CSV)</label>
                <input class="sci-input" type="text" id="settings-spool-column-order-input" placeholder="material,color,location,stock,status">
              </div>
              <div class="sci-input-group">
                <label>Aktive Spalten Vorschau</label>
                <div class="muted tiny" id="settings-spool-column-preview">-</div>
              </div>
              <div class="sci-input-group">
                <label>Aktionen</label>
                <div class="sci-actions">
                  <button type="button" class="sci-btn subtle small" data-settings-action="spool-columns-default">Standard laden</button>
                </div>
              </div>
            </div>
          </article>
        </section>

        <section class="settings-group" id="settings-debug">
          <h3 class="settings-group-title">Browser Diagnose und Navigation</h3>
          <article class="settings-backup-card">
            <h4>Debug Schalter</h4>
            <div class="settings-grid-3">
              <div class="sci-input-group">
                <label>Browser-Diagnostik aktiv</label>
                <input type="hidden" name="debug_browser_diagnostics_enabled" value="0">
                <label class="check-line compact">
                  <input type="checkbox" name="debug_browser_diagnostics_enabled" value="1" {% if settings.debug_browser_diagnostics_enabled in ('1', 'true', 'True', 'yes', 'on') %}checked{% endif %}>
                  Performance-Metriken sammeln und Debug-Werkzeuge freischalten
                </label>
              </div>
              <div class="sci-input-group">
                <label>Log-Level</label>
                <select class="sci-input" name="debug_browser_diagnostics_level">
                  <option value="info" {% if settings.debug_browser_diagnostics_level == 'info' %}selected{% endif %}>info</option>
                  <option value="warn" {% if (settings.debug_browser_diagnostics_level or 'warn') == 'warn' %}selected{% endif %}>warn</option>
                  <option value="error" {% if settings.debug_browser_diagnostics_level == 'error' %}selected{% endif %}>error</option>
                </select>
              </div>
              <div class="sci-input-group">
                <label>Soft Navigation</label>
                <input type="hidden" name="ui_enable_soft_navigation" value="0">
                <label class="check-line compact">
                  <input type="checkbox" name="ui_enable_soft_navigation" value="1" {% if settings.ui_enable_soft_navigation not in ('0', 'false', 'False', '') %}checked{% endif %}>
                  Interne Navigation bevorzugt weich laden
                </label>
              </div>
              <div class="sci-input-group">
                <label>Long Task Schwellwert (ms)</label>
                <input class="sci-input" type="number" min="50" max="2000" step="10" name="debug_browser_diagnostics_longtask_min_ms" value="{{ settings.debug_browser_diagnostics_longtask_min_ms or 180 }}">
              </div>
              <div class="sci-input-group">
                <label>Long Task Fenster (ms)</label>
                <input class="sci-input" type="number" min="1000" max="60000" step="500" name="debug_browser_diagnostics_longtask_window_ms" value="{{ settings.debug_browser_diagnostics_longtask_window_ms or 8000 }}">
              </div>
              <div class="sci-input-group">
                <label>Settings-Load Profil</label>
                <div class="muted tiny" id="settings-load-profile">
                  Gesamt: {{ settings_load_profile.total_ms if settings_load_profile else '-' }} ms |
                  payload: {{ settings_load_profile.payload_ms if settings_load_profile else '-' }} ms |
                  warehouses: {{ settings_load_profile.warehouses_ms if settings_load_profile else '-' }} ms |
                  community: {{ settings_load_profile.community_ms if settings_load_profile else '-' }} ms
                </div>
              </div>
            </div>
            <div class="settings-feedback-points section-gap">
              <div><strong>URL Trigger:</strong> <code>?nexus_perf=report</code> zeigt Overlay, <code>?nexus_perf=download</code> exportiert JSON.</div>
              <div><strong>Reset:</strong> <code>?nexus_perf=clear</code> leert die lokale Perf-Historie.</div>
              <div><strong>Hinweis:</strong> Tools-Daten (Diagnose/Crashlogs/Test-Status) werden auf dieser Seite jetzt lazy geladen, um First Render zu beschleunigen.</div>
            </div>
            <div class="sci-actions section-gap">
              <a class="sci-btn subtle small" href="{{ url_for('web.settings', tab='debug', nexus_perf='report') }}">Perf Report anzeigen</a>
              <a class="sci-btn subtle small" href="{{ url_for('web.settings', tab='debug', nexus_perf='download') }}">Perf Report JSON</a>
              <a class="sci-btn subtle small" href="{{ url_for('web.settings', tab='debug', nexus_perf='clear') }}">Perf Historie leeren</a>
            </div>
          </article>
          <div class="dialog-actions">
            <button type="submit" class="sci-btn">Debug und Ansichten speichern</button>
          </div>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="tools" id="settings-tab-community">
        <div class="section-head">
          <h2 class="sci-h2">Community Profil und Sharing</h2>
          <div class="muted">Hier pflegst du dein Community Profil, Avatarbild und die Upload-Regeln fuer die Community.</div>
        </div>

        <section class="settings-group" id="settings-community-profile">
          <h3 class="settings-group-title">Profil fuer Community Uploads</h3>
          <div class="settings-backup-grid">
            <article class="settings-backup-card settings-backup-card--accent">
              <h4>Benutzerprofil</h4>
              <div class="settings-community-profile-shell">
                <div class="settings-community-profile-visual">
                  <div class="settings-community-profile-avatar" data-settings-community-avatar-preview aria-hidden="true">
                    {% if settings_profile_avatar_url %}
                    <img src="{{ settings_profile_avatar_url }}" alt="{{ settings_profile_name }}">
                    {% else %}
                    {{ settings_profile_initial }}
                    {% endif %}
                  </div>
                  <div class="settings-community-profile-meta">
                    <strong data-settings-community-name-preview>{{ settings.community_profile_name or settings_profile_name }}</strong>
                    <span data-settings-community-id-display>ID {{ settings_profile_public_id }}</span>
                    <small>Diese Kennung wird einmal pro App Installation erzeugt und bleibt fuer den Nutzer unveraenderbar.</small>
                  </div>
                </div>
                <div class="sci-actions">
                  <button type="button" class="sci-btn subtle small" data-open-community-profile>
                    <iconify-icon icon="mdi:account-outline" aria-hidden="true"></iconify-icon> Avatar und Presets oeffnen
                  </button>
                </div>
              </div>
              <div class="settings-grid-3">
                <div class="sci-input-group">
                  <label>Anzeigename</label>
                  <input class="sci-input" type="text" name="community_profile_name" value="{{ settings.community_profile_name or '' }}" maxlength="80" placeholder="z.B. Nova Maker">
                </div>
                  <div class="sci-input-group">
                    <label>Avatar Pfad oder URL (optional)</label>
                    <input class="sci-input" type="text" name="community_profile_avatar_url" value="{{ settings.community_profile_avatar_url or '' }}" placeholder="/settings/community-avatar/... oder https://.../avatar.png" inputmode="url" autocapitalize="off" spellcheck="false">
                  </div>
                <div class="sci-input-group">
                  <label>Oeffentliche Kennung</label>
                  <input class="sci-input" type="text" value="{{ settings_profile_public_id }}" readonly data-settings-community-public-id>
                </div>
              </div>
              <div class="muted tiny">Name und Avatar begleiten Community Uploads, Begruessungen und spaetere Bestenlisten. Die Kennung selbst bleibt fest, damit Uploads eindeutig pro Installation zugeordnet werden koennen.</div>
              <div class="settings-feedback-points">
                <div><strong>Community Client:</strong> {{ community_stats.client_id or 'noch nicht erzeugt' }}</div>
                <div><strong>Aktueller Rang:</strong> {{ settings_gamification.rank_label or community_stats.last_rank_label or 'Community Starter' }} | Level {{ settings_gamification.level or 1 }}</div>
                <div><strong>XP Gesamt:</strong> {{ settings_gamification.total_xp or community_stats.xp_total or 0 }} | App {{ settings_gamification.app_xp or 0 }} | Community {{ settings_gamification.community_xp or community_stats.community_xp_total or community_stats.xp_total or 0 }}</div>
                <div><strong>Uploads:</strong> {{ community_stats.share_count or 0 }} | {{ community_stats.shared_filament_count or 0 }} Profile | {{ community_stats.shared_brand_count or 0 }} Hersteller</div>
              </div>
            </article>

            <article class="settings-backup-card">
              <h4>Community Sync Regeln</h4>
              <div class="settings-grid-3">
                <div class="sci-input-group">
                  <label>Community Endpoint</label>
                  <input class="sci-input" type="url" name="community_share_endpoint_url" value="{{ settings.community_share_endpoint_url or '' }}" placeholder="https://codeschmiede.zapto.org/...">
                </div>
                <div class="sci-input-group">
                  <label>Timeout (Sek.)</label>
                  <input class="sci-input" type="number" min="5" max="120" step="1" name="community_share_timeout_sec" value="{{ settings.community_share_timeout_sec or 20 }}">
                </div>
                <div class="sci-input-group">
                  <label>Auth Token (optional)</label>
                  <input class="sci-input" type="password" name="community_share_auth_token" value="{{ settings.community_share_auth_token or '' }}" placeholder="leer = ungeschuetzt">
                </div>
              </div>
              <div class="settings-inline-fields section-gap">
                <label class="check-line compact">
                  <input type="hidden" name="community_share_include_manufacturer_updates" value="0">
                  <input type="checkbox" name="community_share_include_manufacturer_updates" value="1" {% if settings.community_share_include_manufacturer_updates not in ('0', 'false', 'False', '') %}checked{% endif %}>
                  Herstellerdaten ohne Pack-Stand beim Teilen mit uebertragen
                </label>
                <label class="check-line compact">
                  <input type="hidden" name="community_share_include_empty_spools" value="0">
                  <input type="checkbox" name="community_share_include_empty_spools" value="1" {% if settings.community_share_include_empty_spools not in ('0', 'false', 'False', '') %}checked{% endif %}>
                  Hersteller-Leerspulenprofile immer mit uebertragen
                </label>
              </div>
              <div class="muted tiny">Damit bleiben nicht veroeffentlichte Herstellerdaten, Logos und Leerspulenprofile beim Community-Austausch konsistent und lassen sich spaeter sauber in Packs uebernehmen.</div>
            </article>
          </div>
          <div class="dialog-actions">
            <button type="submit" class="sci-btn">Community Einstellungen speichern</button>
          </div>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="printer3d" id="settings-tab-printer3d">
        <div class="section-head">
          <h2 class="sci-h2">ESP32, Lagergeraete und Controller</h2>
          <div class="muted">Alle Geraete, Verbindungen und Standardwerte an einer Stelle.</div>
        </div>

        <section class="settings-group" id="settings-weighing">
          <div class="section-head compact">
            <h3 class="settings-group-title">Waagen und Wiegen</h3>
          </div>
          <article class="settings-source-card">
            <strong>Der komplette Nexus Scale Bereich wurde in die Hauptnavigation verlagert.</strong>
            <span class="muted">Geraete anlegen, Verbindungen verwalten, Standard-Waage setzen und ESP32 Firmware flashen jetzt zentral unter <code>/weighing</code>.</span>
            <div class="sci-actions">
              <a class="sci-btn subtle small" href="{{ url_for('web.weighing') }}"><iconify-icon icon="mdi:scale-bathroom" aria-hidden="true"></iconify-icon> Bereich Wiegen oeffnen</a>
              <button type="button" class="sci-btn subtle small" data-open-scale-tools data-scale-id="{{ settings.scale_default_device_id or '' }}"><iconify-icon icon="mdi:lan-connect" aria-hidden="true"></iconify-icon> Waagen Tools</button>
              <button type="button" class="sci-btn subtle small" data-open-esp32-flasher><iconify-icon icon="mdi:chip" aria-hidden="true"></iconify-icon> ESP32 Flasher</button>
            </div>
          </article>
        </section>

        <section class="settings-group" id="settings-dryers">
          <div class="section-head compact">
            <h3 class="settings-group-title">Trockner</h3>
            <div class="sci-actions">
              <button type="button" class="sci-btn subtle small" data-add-device="dryer">Trockner hinzufuegen</button>
            </div>
          </div>
          <div class="table-wrap">
            <table class="sci-table settings-device-table">
              <thead>
                <tr>
                  <th>Name</th>
                  <th>Lager</th>
                  <th>Typ</th>
                  <th>Endpoint</th>
                  <th>Topic</th>
                  <th>Ziel Temp / RH</th>
                  <th>Aktiv</th>
                  <th>Aktion</th>
                </tr>
              </thead>
              <tbody id="settings-dryer-body"></tbody>
            </table>
          </div>
        </section>

        <section class="settings-group" id="settings-controllers">
          <div class="section-head compact">
            <h3 class="settings-group-title">Lager Controller</h3>
            <button type="button" class="sci-btn subtle small" data-add-device="warehouse_controller">Controller hinzufuegen</button>
          </div>
          <div class="table-wrap">
            <table class="sci-table settings-device-table">
              <thead>
                <tr>
                  <th>Name</th>
                  <th>Lager</th>
                  <th>Typ</th>
                  <th>Endpoint</th>
                  <th>Topic</th>
                  <th>User</th>
                  <th>Aktiv</th>
                  <th>Aktion</th>
                </tr>
              </thead>
              <tbody id="settings-controller-body"></tbody>
            </table>
          </div>
        </section>

        <div class="dialog-actions">
          <button type="submit" class="sci-btn">Hardware speichern</button>
        </div>
      </section>
        </form>

      <section class="settings-tab-pane" data-settings-tab-pane="tools" id="settings-tab-tools">
      <section class="settings-group" id="settings-tools">
        <div class="section-head compact">
          <h3 class="settings-group-title">Service Tools und Diagnose</h3>
        </div>
        <div class="settings-tools-grid">
          <article class="settings-tool-card" data-settings-tools-pane="esp32-diagnostics">
            <h4>ESP32 Diagnose</h4>
            <div class="muted tiny">Ports, Toolchain und Board-Status auf einen Blick.</div>
            <div class="sci-actions section-gap">
              <button type="button" class="sci-btn subtle small" data-system-action="refresh-diagnostics">Diagnose aktualisieren</button>
            </div>
            <pre class="settings-tool-output" id="settings-diagnostics-output">Wird geladen ...</pre>
          </article>

          <article class="settings-tool-card" data-settings-tools-pane="tool-repair">
            <h4>Tool Repair</h4>
            <div class="muted tiny">Arduino CLI und Build-Abhaengigkeiten reparieren.</div>
            <div class="sci-actions section-gap">
              <button type="button" class="sci-btn subtle small" data-system-action="tool-repair">Repair starten</button>
              <button type="button" class="sci-btn subtle small" data-system-action="tool-repair-status">Status pruefen</button>
            </div>
            <div class="muted tiny" id="settings-tool-repair-status">Kein laufender Repair-Job.</div>
          </article>

          <article class="settings-tool-card" data-settings-tools-pane="test-runner">
            <h4>Entwicklungs-Test Runner</h4>
            <div class="muted tiny">Startet den automatischen Testlauf und zeigt Live-Logs aus der Entwicklungsumgebung.</div>
            <div class="sci-actions section-gap">
              <button type="button" class="sci-btn subtle small" data-system-action="test-runner-start">Tests starten</button>
              <button type="button" class="sci-btn subtle small" data-system-action="test-runner-restart">Neu starten</button>
              <button type="button" class="sci-btn subtle small" data-system-action="test-runner-status">Status</button>
              <button type="button" class="sci-btn subtle small" data-system-action="test-runner-stop">Stop</button>
            </div>
            <div class="muted tiny"><strong>Befehl:</strong> <code id="settings-test-runner-command">-</code></div>
            <div class="muted tiny" id="settings-test-runner-status">Noch kein Testlauf gestartet.</div>
            <div class="muted tiny" id="settings-test-runner-meta">-</div>
            <pre class="settings-tool-output" id="settings-test-runner-output">Noch kein Testlauf gestartet.</pre>
          </article>

          <article class="settings-tool-card" data-settings-tools-pane="worker-manager">
            <h4>Dienstemanager (Demo-Waage)</h4>
            <div class="muted tiny">Worker-Prozess fuer die Demo-Waage starten, stoppen und neu starten.</div>
            <div class="sci-actions section-gap">
              <button type="button" class="sci-btn subtle small" data-system-action="worker-start">Start</button>
              <button type="button" class="sci-btn subtle small" data-system-action="worker-stop">Stop</button>
              <button type="button" class="sci-btn subtle small" data-system-action="worker-restart">Neustart</button>
            </div>
            <div class="muted tiny" id="settings-worker-status">Wird geladen ...</div>
            <div class="muted tiny" id="settings-worker-script">-</div>
          </article>

          <article class="settings-tool-card" data-settings-tools-pane="datasheet-download">
            <h4>Datasheet Download Manager</h4>
            <div class="muted tiny">Fehlende PDFs als Hintergrund-Job laden, pro Hersteller verfolgen und lokal sauber ablegen.</div>
            <div class="settings-inline-fields section-gap">
              <label class="check-line compact">
                <input type="checkbox" id="settings-datasheet-manager-pending-only" checked>
                Nur fehlende PDFs laden
              </label>
              <label class="check-line compact">
                <input type="checkbox" id="settings-datasheet-manager-force-restart">
                Laufenden Job ersetzen
              </label>
            </div>
            <div class="sci-actions section-gap">
              <button type="button" class="sci-btn subtle small" data-system-action="datasheet-manager-start">Start</button>
              <button type="button" class="sci-btn subtle small" data-system-action="datasheet-manager-status">Status</button>
              <button type="button" class="sci-btn subtle small" data-system-action="datasheet-manager-stop">Stop</button>
            </div>
            <div class="muted tiny" id="settings-datasheet-manager-status">Noch kein Download-Job gestartet.</div>
            <div class="muted tiny" id="settings-datasheet-manager-meta">-</div>
            <div class="settings-datasheet-groups section-gap" id="settings-datasheet-manager-groups">
              <div class="sci-empty">Noch keine Hersteller-Auswertung vorhanden.</div>
            </div>
            <pre class="settings-tool-output compact" id="settings-datasheet-manager-errors">Keine Fehler protokolliert.</pre>
            <pre class="settings-tool-output" id="settings-datasheet-manager-log">Noch kein Download-Job gestartet.</pre>
          </article>

        </div>
        <div class="settings-source-card section-gap">
          <div><strong>Waagen Source:</strong> <code>{{ system_diagnostics.processes.demo_scale_worker.script_path }}</code></div>
          <div><strong>Demo-Worker Log:</strong> <code>{{ system_diagnostics.processes.demo_scale_worker.log_path }}</code></div>
        </div>
      </section>

      <section class="settings-group" id="settings-crashlogs">
        <div class="section-head compact">
          <h3 class="settings-group-title">Crashlogs und Fehlerprotokoll</h3>
          <div class="sci-actions">
            <button type="button" class="sci-btn subtle small" data-system-action="crashlogs-refresh">Aktualisieren</button>
            <button type="button" class="sci-btn subtle small" data-system-action="crashlogs-clear">Alle loeschen</button>
          </div>
        </div>
        <div class="muted tiny">Server- und Clientfehler werden zentral protokolliert, damit Debugging reproduzierbar bleibt.</div>
        <div class="settings-crashlog-list section-gap" id="settings-crashlog-list"></div>
      </section>

      <section class="settings-group" id="settings-app-tools">
        <div class="section-head compact">
          <h3 class="settings-group-title">App Tools Schnellzugriff</h3>
        </div>
        <div class="sci-actions">
          <a class="sci-btn subtle small" href="{{ url_for('web.labels') }}"><iconify-icon icon="mdi:label-outline" aria-hidden="true"></iconify-icon> Label Tool</a>
          <a class="sci-btn subtle small" href="{{ url_for('web.wiki') }}"><iconify-icon icon="mdi:book-open-page-variant-outline" aria-hidden="true"></iconify-icon> Wiki</a>
        </div>
      </section>

      <section class="settings-group" id="settings-feedback">
        <div class="section-head compact">
          <h3 class="settings-group-title">Testphase und Feedback</h3>
        </div>
        <div class="settings-feedback-grid">
          <article class="settings-feedback-card">
            <h4>Feedback Center fuer Tester</h4>
            <p class="muted">
              Rueckmeldungen, Bedienprobleme, Ideen und reproduzierbare Fehler sollen waehrend der Testphase direkt aus der App
              gesammelt werden. Die Queue bleibt lokal erhalten, falls der Server gerade nicht erreichbar ist.
            </p>
            <div class="settings-feedback-points">
              <div><strong>Direkt aus der App:</strong> Problem oder Idee ohne Umweg ueber externe Tools melden.</div>
              <div><strong>Lokale Queue:</strong> Nicht gesendete Rueckmeldungen koennen spaeter erneut uebertragen werden.</div>
              <div><strong>Kontext inklusive:</strong> Seite, Bildschirmgroesse und Laufzeitinfos koennen direkt mitgegeben werden.</div>
            </div>
            <div class="sci-actions section-gap">
              <button type="button" class="sci-btn" data-open-global-bug-tracker>Feedback senden</button>
              <a class="sci-btn subtle small" href="{{ url_for('web.wiki') }}#roadmap-und-changelog">Was ist neu?</a>
              <a class="sci-btn subtle small" href="{{ url_for('web.roadmap') }}">Roadmap ansehen</a>
            </div>
          </article>
        </div>
      </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="backup" id="settings-tab-backup">
      <section class="settings-group" id="settings-storage">
        <div class="section-head compact">
          <h3 class="settings-group-title">Datenpfade und Runtime</h3>
        </div>
        <div class="settings-path-grid">
          {% for path_row in system_diagnostics.inventory.paths %}
          <article class="settings-path-card">
            <div class="settings-path-label">{{ path_row.label }}</div>
            <code>{{ path_row.path }}</code>
          </article>
          {% endfor %}
        </div>
        <div class="muted tiny">Datenbank, PDFs, Logs und User-Settings liegen getrennt im Data Root und sind damit vom Programmcode entkoppelt.</div>
      </section>

      <section class="settings-group" id="settings-backup">
        <div class="section-head compact">
          <h3 class="settings-group-title">Lokale Datensicherung</h3>
        </div>

        <article class="settings-backup-hero">
          <div class="settings-backup-hero-copy">
            <strong>Komplette Datenbank lokal sichern und spaeter wieder exakt einspielen.</strong>
            <p class="muted">
              Fuer Tests, Rechnerwechsel oder vor groesseren Importen empfehlen wir eine komplette SQLite-Sicherung.
              Damit bleiben Filamente, Spulen, Lager, Statistiken und Einstellungen gemeinsam in einem Backup erhalten.
            </p>
          </div>
          <div class="settings-backup-hero-actions">
            <a class="sci-btn" href="{{ url_for('web.settings_backup_export_sqlite', mode='full') }}">Komplette SQLite-Sicherung</a>
            <a class="sci-btn subtle small" href="{{ url_for('web.settings_backup_export_json', mode='full') }}">JSON-Notfall-Export</a>
          </div>
        </article>

        <div class="settings-backup-grid">
          <article class="settings-backup-card settings-backup-card--accent">
            <h4>Empfohlener Ablauf vor Tests</h4>
            <div class="settings-feedback-points">
              <div><strong>1. Vor Aenderungen sichern:</strong> Erst eine komplette SQLite-Datei herunterladen.</div>
              <div><strong>2. Testen und Daten sammeln:</strong> Danach neue Packs, Community-Funktionen oder Imports pruefen.</div>
              <div><strong>3. Bei Bedarf wiederherstellen:</strong> Die gleiche Sicherung kann spaeter direkt wieder eingespielt werden.</div>
            </div>
            <div class="sci-actions section-gap">
              <a class="sci-btn subtle small" href="{{ url_for('web.settings_backup_export_sqlite', mode='full') }}">Jetzt sichern</a>
            </div>
          </article>

          <article class="settings-backup-card settings-backup-card--restore">
            <h4>Gesamte Sicherung wiederherstellen</h4>
            <div class="muted">
              Unterstuetzt komplette SQLite-Backups und JSON-Backups. Vor dem Wiederherstellen am besten erst eine frische Sicherung des
              aktuellen Standes herunterladen.
            </div>
            <form id="settingsImportForm" class="settings-import-form section-gap" enctype="multipart/form-data">
              <div class="settings-grid-3">
                <div class="sci-input-group">
                  <label>Datei</label>
                  <input class="sci-input" type="file" name="backup_file" accept=".json,.sqlite,.sqlite3,.db" required>
                </div>
                <div class="sci-input-group">
                  <label>Format</label>
                  <select class="sci-input" name="format">
                    <option value="sqlite" selected>SQLite</option>
                    <option value="json">JSON</option>
                  </select>
                </div>
                <div class="sci-input-group">
                  <label>Modus</label>
                  <select class="sci-input" name="mode" id="settings-import-mode">
                    <option value="full" selected>Komplette Wiederherstellung</option>
                    <option value="partial">Teil Import</option>
                  </select>
                </div>
              </div>
              <div class="settings-restore-warning">
                Diese Aktion schreibt vorhandene Daten zurueck. Fuer eine sichere Rueckfallebene am besten zuerst eine aktuelle Sicherung exportieren.
              </div>
              <div class="settings-component-list" id="settings-import-components"></div>
              <div class="dialog-actions">
                <a class="sci-btn subtle small" href="{{ url_for('web.settings_backup_export_sqlite', mode='full') }}">Vorher aktuellen Stand sichern</a>
                <button type="submit" class="sci-btn">Sicherung wiederherstellen</button>
              </div>
            </form>
          </article>
        </div>

        <details class="settings-advanced-backup section-gap">
          <summary>Erweiterte Sicherung fuer Teil-Export und selektiven Import</summary>
          <div class="settings-backup-grid settings-backup-grid--advanced">
            <article class="settings-backup-card">
              <h4>Teil Export</h4>
              <div class="muted">Nur ausgewaehlte Komponenten als JSON oder SQLite exportieren.</div>
              <div class="settings-export-controls section-gap">
                <div class="sci-input-group">
                  <label>Format</label>
                  <select id="partial-export-format" class="sci-input">
                    <option value="json">JSON</option>
                    <option value="sqlite">SQLite</option>
                  </select>
                </div>
                <div class="settings-component-list" id="partial-export-components"></div>
                <button type="button" id="partial-export-run" class="sci-btn subtle small">Teil Export starten</button>
              </div>
            </article>
          </div>
        </details>
      </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="updates" id="settings-tab-updates">
        <section class="settings-group" id="settings-updates">
          <div class="section-head">
            <h2 class="sci-h2">Updates</h2>
            <div class="muted">Changelog, Roadmap und Upgrade-Hinweise fuer die naechsten Releases.</div>
          </div>
          <article class="settings-backup-card">
            <h4>Release Informationen</h4>
            <div class="settings-feedback-points">
              <div><strong>Roadmap:</strong> Plane kommende Funktionen und offene Punkte.</div>
              <div><strong>Wiki Changelog:</strong> Verfolge aenderungen nach Version.</div>
              <div><strong>Hinweis:</strong> Vor groesseren Updates immer erst ein SQLite Backup erstellen.</div>
            </div>
            <div class="sci-actions section-gap">
              <a class="sci-btn subtle small" href="{{ url_for('web.roadmap') }}">Roadmap oeffnen</a>
              <a class="sci-btn subtle small" href="{{ url_for('web.wiki') }}#roadmap-und-changelog">Changelog im Wiki</a>
              <a class="sci-btn subtle small" href="{{ url_for('web.settings_backup_export_sqlite', mode='full') }}">Vor Update sichern</a>
            </div>
          </article>
        </section>
      </section>

      <section class="settings-tab-pane" data-settings-tab-pane="version" id="settings-tab-version">
        <section class="settings-group" id="settings-version">
          <div class="section-head">
            <h2 class="sci-h2">Version</h2>
            <div class="muted">Build- und Laufzeitinformationen der aktuellen Installation.</div>
          </div>
          <div class="settings-backup-grid">
            <article class="settings-backup-card settings-backup-card--accent">
              <h4>App</h4>
              <div class="settings-feedback-points">
                <div><strong>Name:</strong> Nexus Core</div>
                <div><strong>Asset Version:</strong> {{ static_asset_version or '-' }}</div>
                <div><strong>Requirements:</strong> {{ version_inventory.requirements|length if version_inventory and version_inventory.requirements else 0 }}</div>
              </div>
            </article>
            <article class="settings-backup-card">
              <h4>Runtime</h4>
              <div class="settings-feedback-points">
                {% if version_inventory and version_inventory.runtime_versions %}
                {% for row in version_inventory.runtime_versions[:4] %}
                <div><strong>{{ row.name }}:</strong> {{ row.version }}</div>
                {% endfor %}
                {% else %}
                <div><strong>Runtime:</strong> -</div>
                {% endif %}
              </div>
            </article>
          </div>
        </section>
      </section>
      </div>
    </div>
  </div>
</section>
{% endblock %}
{% block data_blocks %}
<script id="settings-page-json" type="application/json">{{ {'settings': settings, 'scales': scales, 'warehouse_controllers': warehouse_controllers, 'dryers': dryers}|tojson }}</script>
<script id="scale-devices" type="application/json">{{ scales|tojson }}</script>
<script id="settings-warehouses-json" type="application/json">{{ warehouses_json|tojson }}</script>
<script id="settings-backup-components-json" type="application/json">{{ backup_components|tojson }}</script>
<script id="settings-system-diagnostics-json" type="application/json">{{ system_diagnostics|tojson }}</script>
<script id="settings-crashlogs-json" type="application/json">{{ crashlogs|tojson }}</script>
<script id="settings-test-runner-json" type="application/json">{{ test_runner|tojson }}</script>
<script id="settings-datasheet-manager-json" type="application/json">{{ datasheet_manager|tojson }}</script>
{% endblock %}