{{define "admin/site_pages.html"}}
{{template "admin_shell_open" .}}
<style>
.cs-sitepages-tabs { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1rem; padding:.35rem; border-radius:.5rem; background:#f8fafc; border:1px solid #e2e8f0; }
.cs-sitepages-tabs a { display:inline-flex; align-items:center; gap:.35rem; padding:.45rem .9rem; border-radius:.4rem; border:1px solid transparent; color:#475569; text-decoration:none; font-weight:600; font-size:.9rem; }
.cs-sitepages-tabs a:hover { background:#fff; border-color:#e2e8f0; color:#0f172a; }
.cs-sitepages-tabs a.is-active { background:#fff; border-color:#0d6efd; color:#0d6efd; }
.cs-sitepages-toolbar { display:flex; flex-wrap:wrap; gap:.85rem 1.2rem; align-items:flex-end; margin-bottom:1rem; padding:1rem; border:1px solid #e2e8f0; border-radius:.5rem; background:#fff; }
.cs-sitepages-badge { display:inline-flex; align-items:center; min-height:2.2rem; padding:.3rem .7rem; border-radius:.4rem; font-size:.84rem; font-weight:600; background:#ecfdf5; color:#047857; border:1px solid #a7f3d0; }
.cs-sitepages-badge--muted { background:#f8fafc; color:#64748b; border-color:#e2e8f0; }
.cs-sitepages-html { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.875rem; line-height:1.6; min-height:22rem; }
</style>
<div class="cs-admin-page">
{{template "admin_flash" .}}

<header class="cs-admin-pagehead">
  <div class="d-flex align-items-start gap-3 flex-grow-1 min-w-0">
    <div class="cs-admin-pagehead__icon" aria-hidden="true"><i class="bx bx-file-blank"></i></div>
    <div class="cs-admin-pagehead__body">
      <h1 class="cs-admin-pagehead__title">{{T "admin.site_pages.title"}}</h1>
      <p class="cs-admin-pagehead__desc">{{T "admin.site_pages.desc"}}</p>
    </div>
  </div>
</header>

{{if .Data.ShowComplianceAdmin}}
<div class="card cs-admin-section mb-3">
  <div class="card-body">
    <h2 class="h6 mb-2">{{T "admin.site_pages.compliance_h2"}}</h2>
    <p class="small text-muted mb-3">{{T "admin.site_pages.compliance_hint"}}</p>
    <form method="post" action="/admin/site-pages" class="w-100">
      <input type="hidden" name="action" value="save_compliance">
      <input type="hidden" name="page" value="{{.Data.AdminSitePageStem}}">
      <input type="hidden" name="content_lang" value="{{.Data.AdminSitePageLang}}">
      <div class="form-check form-switch mb-3">
        <input class="form-check-input" type="checkbox" name="compliance_enabled" value="1" id="compliance_enabled" {{if .Data.ComplianceEnabled}}checked{{end}}>
        <label class="form-check-label" for="compliance_enabled">{{T "admin.site_pages.compliance_enable"}}</label>
      </div>
      <div class="mb-2"><label class="form-label small">{{T "admin.site_pages.gdpr_link"}}</label><input class="form-control form-control-sm" type="text" name="compliance_gdpr_link" maxlength="80" value="{{.Data.ComplianceGDPRLink}}"></div>
      <div class="mb-2"><label class="form-label small">{{T "admin.site_pages.gdpr_title"}}</label><input class="form-control form-control-sm" type="text" name="compliance_gdpr_title" maxlength="120" value="{{.Data.ComplianceGDPRTitle}}"></div>
      <div class="mb-3"><label class="form-label small">{{T "admin.site_pages.gdpr_body"}}</label><textarea class="form-control form-control-sm cs-sitepages-html" name="compliance_gdpr_body" rows="4">{{.Data.ComplianceGDPRBody}}</textarea></div>
      <div class="mb-2"><label class="form-label small">{{T "admin.site_pages.ccpa_link"}}</label><input class="form-control form-control-sm" type="text" name="compliance_ccpa_link" maxlength="80" value="{{.Data.ComplianceCCPALink}}"></div>
      <div class="mb-2"><label class="form-label small">{{T "admin.site_pages.ccpa_title"}}</label><input class="form-control form-control-sm" type="text" name="compliance_ccpa_title" maxlength="120" value="{{.Data.ComplianceCCPATitle}}"></div>
      <div class="mb-3"><label class="form-label small">{{T "admin.site_pages.ccpa_body"}}</label><textarea class="form-control form-control-sm cs-sitepages-html" name="compliance_ccpa_body" rows="4">{{.Data.ComplianceCCPABody}}</textarea></div>
      <div class="mb-2"><label class="form-label small">{{T "admin.site_pages.cookie_title"}}</label><input class="form-control form-control-sm" type="text" name="compliance_cookie_title" maxlength="120" value="{{.Data.ComplianceCookieTitle}}"></div>
      <div class="mb-3"><label class="form-label small">{{T "admin.site_pages.cookie_body"}}</label><textarea class="form-control form-control-sm" name="compliance_cookie_body" rows="3" maxlength="960">{{.Data.ComplianceCookieBody}}</textarea></div>
      <button type="submit" class="btn btn-primary btn-sm"><i class="bx bx-save me-1"></i>{{T "admin.site_pages.save_compliance"}}</button>
    </form>
  </div>
</div>
{{end}}

<div class="card cs-admin-section mb-3">
  <div class="card-body">
    <h2 class="h6 mb-2">{{T "admin.site_pages.nav_h2"}}</h2>
    <p class="small text-muted mb-3">{{T "admin.site_pages.nav_hint"}}</p>
    <form method="post" action="/admin/site-pages">
      <input type="hidden" name="action" value="save_nav">
      <input type="hidden" name="page" value="{{.Data.AdminSitePageStem}}">
      <input type="hidden" name="content_lang" value="{{.Data.AdminSitePageLang}}">
      <div class="table-responsive">
        <table class="table table-sm align-middle mb-2">
          <thead>
            <tr>
              <th style="width:4rem;">{{T "admin.site_pages.col_show"}}</th>
              <th style="width:7rem;">{{T "admin.site_pages.col_page"}}</th>
              <th>{{T "admin.site_pages.col_label"}}</th>
              <th>{{T "admin.site_pages.col_url"}}</th>
              <th style="width:5rem;">{{T "admin.site_pages.col_sort"}}</th>
            </tr>
          </thead>
          <tbody>
            {{$defs := .Data.AdminSitePageNavDefault}}
            {{range .Data.AdminSitePageNav}}
            <tr>
              <td>
                <input type="checkbox" class="form-check-input" name="nav_enabled_{{.Stem}}" value="1" {{if .Enabled}}checked{{end}}>
              </td>
              <td><code>{{.Stem}}</code></td>
              <td>
                <input class="form-control form-control-sm" type="text" name="nav_label_{{.Stem}}" maxlength="64" value="{{.Label}}" placeholder="{{index $defs .Stem}}">
              </td>
              <td>
                <input class="form-control form-control-sm font-monospace" type="text" name="nav_url_{{.Stem}}" maxlength="500" value="{{.URL}}" placeholder="/{{.Stem}}">
              </td>
              <td>
                <input class="form-control form-control-sm" type="number" name="nav_sort_{{.Stem}}" value="{{.Sort}}">
              </td>
            </tr>
            {{end}}
          </tbody>
        </table>
      </div>
      <div class="form-text mb-2">{{T "admin.site_pages.nav_url_hint"}}</div>
      <button type="submit" class="btn btn-primary btn-sm"><i class="bx bx-save me-1"></i>{{T "admin.site_pages.save_nav"}}</button>
    </form>
  </div>
</div>

<div id="sd-sitepages-public" style="scroll-margin-top:1.25rem">
<nav class="cs-sitepages-tabs" aria-label="{{T "admin.site_pages.aria_tabs"}}">
  <a href="/admin/site-pages?page=help&amp;content_lang={{.Data.AdminSitePageLang}}#sd-sitepages-public" class="{{if eq .Data.AdminSitePageStem "help"}}is-active{{end}}"><i class="bx bx-help-circle"></i> {{T "admin.site_pages.tab_help"}}</a>
  <a href="/admin/site-pages?page=terms&amp;content_lang={{.Data.AdminSitePageLang}}#sd-sitepages-public" class="{{if eq .Data.AdminSitePageStem "terms"}}is-active{{end}}"><i class="bx bx-file"></i> {{T "admin.site_pages.tab_terms"}}</a>
  <a href="/admin/site-pages?page=privacy&amp;content_lang={{.Data.AdminSitePageLang}}#sd-sitepages-public" class="{{if eq .Data.AdminSitePageStem "privacy"}}is-active{{end}}"><i class="bx bx-shield"></i> {{T "admin.site_pages.tab_privacy"}}</a>
  <a href="/admin/site-pages?page=contact&amp;content_lang={{.Data.AdminSitePageLang}}#sd-sitepages-public" class="{{if eq .Data.AdminSitePageStem "contact"}}is-active{{end}}"><i class="bx bx-envelope"></i> {{T "admin.site_pages.tab_contact"}}</a>
  <a href="/admin/site-pages?page=about&amp;content_lang={{.Data.AdminSitePageLang}}#sd-sitepages-public" class="{{if eq .Data.AdminSitePageStem "about"}}is-active{{end}}"><i class="bx bx-info-circle"></i> {{T "admin.site_pages.tab_about"}}</a>
  {{range .Data.AdminSitePageCustomTabs}}
  <a href="/admin/site-pages?page={{index . "stem"}}&amp;content_lang={{$.Data.AdminSitePageLang}}#sd-sitepages-public" class="{{if eq $.Data.AdminSitePageStem (index . "stem")}}is-active{{end}}"><i class="bx bx-file-blank"></i> {{index . "label"}}</a>
  {{end}}
</nav>

<form method="post" action="/admin/site-pages?page={{.Data.AdminSitePageStem}}&amp;content_lang={{.Data.AdminSitePageLang}}#sd-sitepages-public" class="row g-2 align-items-end mb-3 pb-3 border-bottom">
  <input type="hidden" name="action" value="create_custom">
  <input type="hidden" name="content_lang" value="{{.Data.AdminSitePageLang}}">
  <div class="col-auto">
    <label class="form-label small mb-1" for="custom_stem">{{T "admin.site_pages.custom_stem"}}</label>
    <input class="form-control form-control-sm" id="custom_stem" name="custom_stem" maxlength="32" pattern="[a-z][a-z0-9-]{1,31}" placeholder="refund" required>
  </div>
  <div class="col-auto">
    <label class="form-label small mb-1" for="custom_label">{{T "admin.site_pages.custom_label"}}</label>
    <input class="form-control form-control-sm" id="custom_label" name="custom_label" maxlength="64" placeholder="{{T "admin.site_pages.custom_label_ph"}}">
  </div>
  <div class="col-auto align-self-end">
    <button type="submit" class="btn btn-sm btn-outline-primary"><i class="bx bx-plus me-1"></i>{{T "admin.site_pages.custom_create"}}</button>
  </div>
  <div class="col-12"><div class="form-text mb-0">{{T "admin.site_pages.custom_hint"}}</div></div>
</form>

<div class="cs-sitepages-toolbar">
  <div>
    <label class="form-label small text-muted mb-1" for="csSitePageLang">{{T "admin.site_pages.content_lang"}}</label>
    <select class="form-select" id="csSitePageLang" style="min-width:10rem" onchange="window.location.href='/admin/site-pages?page={{.Data.AdminSitePageStem}}&amp;content_lang='+encodeURIComponent(this.value)+'#sd-sitepages-public'">
      {{range .Data.AdminSitePageLocales}}
      <option value="{{.}}"{{if eq . $.Data.AdminSitePageLang}} selected{{end}}>{{.}}</option>
      {{end}}
    </select>
  </div>
  <div>
    {{if .Data.AdminSitePageHasOverlay}}
    <span class="cs-sitepages-badge"><i class="bx bx-check-circle me-1"></i>{{T "admin.site_pages.badge_custom"}}</span>
    {{else}}
    <span class="cs-sitepages-badge cs-sitepages-badge--muted"><i class="bx bx-package me-1"></i>{{T "admin.site_pages.badge_default"}}</span>
    {{end}}
  </div>
</div>

<div class="card cs-admin-section">
  <div class="card-body">
    <form method="post" action="/admin/site-pages" class="cs-sitepages-form">
      <input type="hidden" name="page" value="{{.Data.AdminSitePageStem}}">
      <input type="hidden" name="content_lang" value="{{.Data.AdminSitePageLang}}">
      <div class="mb-3">
        <label class="form-label fw-semibold" for="field_page_title">{{T "admin.site_pages.field_title"}}</label>
        <input class="form-control" id="field_page_title" name="field_page_title" type="text" maxlength="120" value="{{index .Data.AdminSitePageValues "page.title"}}">
      </div>
      <div class="mb-3">
        <label class="form-label fw-semibold" for="field_page_description">{{T "admin.site_pages.field_desc"}}</label>
        <input class="form-control" id="field_page_description" name="field_page_description" type="text" maxlength="300" value="{{index .Data.AdminSitePageValues "page.description"}}">
      </div>
      <div class="mb-3">
        <label class="form-label fw-semibold" for="field_page_keywords">{{T "admin.site_pages.field_keywords"}}</label>
        <input class="form-control" id="field_page_keywords" name="field_page_keywords" type="text" maxlength="300" value="{{index .Data.AdminSitePageValues "page.keywords"}}">
      </div>
      <div class="mb-3">
        <label class="form-label fw-semibold" for="field_page_body">{{T "admin.site_pages.field_body"}}</label>
        <p class="small text-muted mb-2">{{T "admin.site_pages.body_hint"}}</p>
        <textarea class="form-control cs-sitepages-html" id="field_page_body" name="field_page_body" rows="22" maxlength="32000">{{index .Data.AdminSitePageValues "page.body"}}</textarea>
      </div>
      <div class="d-flex flex-wrap gap-2 align-items-center">
        <button type="submit" class="btn btn-primary"><i class="bx bx-save me-1"></i>{{T "admin.site_pages.save"}}</button>
        <a class="btn btn-outline-secondary" href="{{.Data.AdminSitePagePreviewURL}}" target="_blank" rel="noopener noreferrer"><i class="bx bx-link-external me-1"></i>{{T "admin.site_pages.preview"}}</a>
        {{if .Data.AdminSitePageIsCustom}}
        <button type="submit" class="btn btn-outline-danger" name="action" value="delete_custom" onclick="return confirm({{jsString (T "admin.site_pages.custom_delete_confirm")}});"><i class="bx bx-trash me-1"></i>{{T "admin.site_pages.custom_delete"}}</button>
        {{else}}
        <button type="submit" class="btn btn-outline-danger" name="action" value="reset" onclick="return confirm({{jsString (T "admin.site_pages.reset_confirm")}});"><i class="bx bx-reset me-1"></i>{{T "admin.site_pages.reset"}}</button>
        {{end}}
      </div>
    </form>
  </div>
</div>
</div>
</div>
<script>
(function () {
  var params = new URLSearchParams(window.location.search || '');
  var want = params.has('page') || (window.location.hash || '') === '#sd-sitepages-public';
  if (!want) return;
  function scrollPublicBlock() {
    var el = document.getElementById('sd-sitepages-public');
    if (!el || typeof el.scrollIntoView !== 'function') return;
    el.scrollIntoView({ behavior: 'smooth', block: 'start' });
  }
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', function () { setTimeout(scrollPublicBlock, 0); });
  } else {
    setTimeout(scrollPublicBlock, 0);
  }
})();
</script>
{{template "admin_shell_close" .}}
{{end}}