{% if space_url and space_id and language %}
  <p class="env-vars-intro">{{ 'Add these to your frontend <strong>.env</strong> / <strong>.env.local</strong>, or your <a href="https://vercel.com/" target="_blank" rel="noopener">Vercel</a> / Netlify project settings.'|t }}</p>

  <div class="env-file-wrapper">
    <div class="env-file-header">
      <span class="env-file-label">.env</span>
      <button type="button" class="env-copy-btn" data-clipboard-target="#env-main">
        <span class="env-copy-btn__icon">&#x2398;</span> {{ 'Copy'|t }}
      </button>
    </div>
    <pre class="env-file" id="env-main">
# NodeHive
NEXT_PUBLIC_DRUPAL_REST_BASE_URL="https://{{ base_url }}"
NEXT_PUBLIC_DRUPAL_BASE_URL="https://{{ base_url }}"
NEXT_IMAGE_DOMAIN="{{ base_url }}"

# Frontend
NEXT_PUBLIC_FRONTEND_BASE_URL="{{ space_url }}"

# Drupal NodeHive
NEXT_PUBLIC_DRUPAL_NODEHIVE_SPACE_ID={{ space_id }}
NEXT_PUBLIC_NODEHIVE_SPACE_NAME="nodehive_{{ space_id }}"
NODEHIVE_STARTPAGE_SLUG=/node/{{ homepage }}
NODEHIVE_DEFAULT_LANGUAGE={{ language }}</pre>
  </div>

  <div class="env-file-wrapper env-file-wrapper--optional">
    <div class="env-file-header">
      <span class="env-file-label">{{ 'Local development only'|t }}</span>
      <button type="button" class="env-copy-btn" data-clipboard-target="#env-optional">
        <span class="env-copy-btn__icon">&#x2398;</span> {{ 'Copy'|t }}
      </button>
    </div>
    <pre class="env-file" id="env-optional">
NODE_TLS_REJECT_UNAUTHORIZED=0</pre>
  </div>
{% else %}
  <p class="env-vars-empty">{{ 'Environment variables will appear here once the space is configured.'|t }}</p>
{% endif %}
