<link rel="stylesheet" href="{{ url_for('static', filename='token.css') }}">
  
  <div class="container-fluid token-container">
      {% set folder_names = token_folder | map(attribute='foldername') | list %}
      <div class="card h-100 shadow-sm text-center" id="tokenPrintable">
        <h2 class="token-page-title">{{ title_long }}</h2>
        {% if folder_names %}
        <h3 class="token-folder-title">{{ folder_names | join(', ') }}</h3>
        {% endif %}
        <div class="token-qr-wrap mt-3">
          <img src="/custom_logo/logoW.png" class="token-pdf-logo" alt="Logo">
          <img src="data:image/png;base64,{{ token_qr_code }}" class="card-img-top qr-code p-3" alt="QR Code for token">
        </div>
        <div class="card-body">
          <div class="card-text mt-2">
              <div class="token-action-buttons d-flex flex-wrap gap-2 justify-content-center text-center">
                <a href="{{ token_url }}" class="copy-btn" style="text-decoration: none;" id="tokenLink">Link öffnen</a>
                <button class="copy-btn" onclick="toClipboard('{{ token_url }}')">Link kopieren</button>
                <button class="copy-btn" id="printTokenButton" type="button" onclick="printToken()">Drucken</button>
              </div>
          </div>
          <div class="card-text mt-2">
              <h2 class="mt-3">Gültig bis:</h2>
              {{ token_valid_to }}
          </div>
          <!-- <div class="card-text mt-2">
              <h2 class="mt-3">Ordner:</h2>
              {% for folder in token_folder %}
              {{ folder.foldername }}<br>
              {% endfor %}
          </div> -->
        </div>
      </div>
  </div>
  
  
