{% if template is empty %}
    {% set template = package('template').getPackageProperties(template_name,false) %}
{% endif %}
{% set show_requires = show_requires|default(false) %}
{% set show_buttons = show_buttons|default(true) %}
{% set primary_template = getOption('primary.template') %}
<div class="ui card raised {{ class }} " id="{{ template_name }}">    
    <div class="content item">              
        <div class="font-bold mt-1 pl-1">
            {% if template.icon is not empty %}
            <i class="icon blue {{ template.icon }}"></i>
            {% endif %}   
            {{ template.title }}           
            {% if template.name == system_template_name %}
            <div class="ui horizontal right floated mini label blue">  
                {{ labels.system }}  
            </div>
            {% endif %}
            {% if template.name == primary_template %}
            <div class="ui horizontal right floated mini label green primary-label">  
                {{ labels.primary }}  
            </div>
            {% endif %}
            <div class="ui horizontal basic right floated mini label">               
                {{ labels.version }} 
                <div class="detail">{{ template.version }}</div>
            </div>               
        </div>
    </div>
    <div class="content">      
        {% set src = (template.thumbnail is not empty) ? getTemplateUrl(template_name) ~ '/images/' ~ template.thumbnail : null %}     
        {{ component('system:admin.templates.template.image',{ src: src }) }}                            
    </div>                   
    <div class="extra content">
        <p class="text-black">
            {{ template.description }}
        </p>                
    </div>
    <div class="p-2">
        <div class="ui success mini message opacity-0 m-2" id="message_{{ template.name }}"></div>
    </div> 
    {% if show_requires == true %}
    <div class="content">
        {{ component('system:admin.templates.template.requires',{ items: template.requires.library }) }}               
    </div> 
    {% endif %}
    {% if show_buttons == true %}
    <div class="extra content">
        <div class="ui mini fluid buttons">                              
            {% if template.name != system_template_name %}
                <button class="ui button basic olive update-button {{ (demo_mode == true) ? 'disabled' : ''}}" template="{{ template.name }}">
                    <i class="icon refresh"></i>
                    {{ buttons.update.content }}
                </button>
                {% set disabled = (template.name == primary_template) ? 'disabled' : '' %}                 
                <button class="ui button basic set-primary {{ disabled }} {{ (demo_mode == true) ? 'disabled' : ''}}" template="{{ template.name }}">
                    <i class="icon angle double up"></i>      
                    {{ buttons.primary.content }}
                </button>                                     
            {% endif %}    
            <button class="ui button basic details-button" template="{{ template.name }}">
                <i class="icon list layout"></i>
                {{ buttons.details.content }}
            </button>
        </div>
    </div>
    {% endif %}
</div>