{{define "admin_sidebar_nav_links"}}
        <div class="nav-item" data-nav-group="dashboard">
          <a class="nav-link {{if eq (index .Data "ActiveNav") "dashboard"}}active{{end}}" data-nav="dashboard" href="/admin"><i class="bx bx-grid-alt"></i><span>{{T "admin.nav.dashboard"}}</span></a>
        </div>
        <div class="nav-item has-sub {{if or (eq (index .Data "ActiveNav") "users") (eq (index .Data "ActiveNav") "sites") (eq (index .Data "ActiveNav") "sessions")}}is-active{{end}}" data-nav-group="biz">
          <button type="button" class="nav-link nav-parent {{if or (eq (index .Data "ActiveNav") "users") (eq (index .Data "ActiveNav") "sites") (eq (index .Data "ActiveNav") "sessions")}}active{{end}}" aria-haspopup="true">
            <i class="bx bx-briefcase"></i><span>{{T "admin.nav.group_biz"}}</span><i class="bx bx-chevron-right nav-caret"></i>
          </button>
          <div class="nav-flyout">
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "users"}}active{{end}}" data-nav="users" href="/admin/users"><i class="bx bx-user"></i>{{T "admin.nav.users"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "sites"}}active{{end}}" data-nav="sites" href="/admin/sites"><i class="bx bx-globe"></i>{{T "admin.nav.sites"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "sessions"}}active{{end}}" data-nav="sessions" href="/admin/sessions"><i class="bx bx-chat"></i>{{T "admin.nav.sessions"}}</a>
          </div>
        </div>
        <div class="nav-item has-sub {{if or (eq (index .Data "ActiveNav") "event_tables") (eq (index .Data "ActiveNav") "notify_events") (eq (index .Data "ActiveNav") "attachments")}}is-active{{end}}" data-nav-group="data">
          <button type="button" class="nav-link nav-parent {{if or (eq (index .Data "ActiveNav") "event_tables") (eq (index .Data "ActiveNav") "notify_events") (eq (index .Data "ActiveNav") "attachments")}}active{{end}}" aria-haspopup="true">
            <i class="bx bx-data"></i><span>{{T "admin.nav.group_data"}}</span><i class="bx bx-chevron-right nav-caret"></i>
          </button>
          <div class="nav-flyout">
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "event_tables"}}active{{end}}" data-nav="event_tables" href="/admin/visitor-event-tables"><i class="bx bx-list-ul"></i>{{T "admin.nav.event_tables"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "attachments"}}active{{end}}" data-nav="attachments" href="/admin/attachments"><i class="bx bx-paperclip"></i>{{T "admin.nav.attachments"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "notify_events"}}active{{end}}" data-nav="notify_events" href="/admin/notify-events"><i class="bx bx-list-check"></i>{{T "admin.nav.notify_events"}}</a>
          </div>
        </div>
        {{if .IsPro}}
        <div class="nav-item has-sub {{if or (eq (index .Data "ActiveNav") "plans") (eq (index .Data "ActiveNav") "payment_interfaces") (eq (index .Data "ActiveNav") "orders")}}is-active{{end}}" data-nav-group="commerce">
          <button type="button" class="nav-link nav-parent {{if or (eq (index .Data "ActiveNav") "plans") (eq (index .Data "ActiveNav") "payment_interfaces") (eq (index .Data "ActiveNav") "orders")}}active{{end}}" aria-haspopup="true">
            <i class="bx bx-credit-card"></i><span>{{T "admin.nav.group_commerce"}}</span><i class="bx bx-chevron-right nav-caret"></i>
          </button>
          <div class="nav-flyout">
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "plans"}}active{{end}}" data-nav="plans" href="/admin/plans"><i class="bx bx-package"></i>{{T "admin.nav.plans"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "payment_interfaces"}}active{{end}}" data-nav="payment_interfaces" href="/admin/payment-interfaces"><i class="bx bx-credit-card"></i>{{T "admin.nav.payment_interfaces"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "orders"}}active{{end}}" data-nav="orders" href="/admin/orders"><i class="bx bx-receipt"></i>{{T "admin.nav.orders"}}</a>
          </div>
        </div>
        {{end}}
        <div class="nav-item has-sub {{if or (eq (index .Data "ActiveNav") "settings") (eq (index .Data "ActiveNav") "site_pages") (eq (index .Data "ActiveNav") "announcements")}}is-active{{end}}" data-nav-group="system">
          <button type="button" class="nav-link nav-parent {{if or (eq (index .Data "ActiveNav") "settings") (eq (index .Data "ActiveNav") "site_pages") (eq (index .Data "ActiveNav") "announcements")}}active{{end}}" aria-haspopup="true">
            <i class="bx bx-cog"></i><span>{{T "admin.nav.group_system"}}</span><i class="bx bx-chevron-right nav-caret"></i>
          </button>
          <div class="nav-flyout">
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "settings"}}active{{end}}" data-nav="settings" href="/admin/settings"><i class="bx bx-slider-alt"></i>{{T "admin.nav.settings"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "site_pages"}}active{{end}}" data-nav="site_pages" href="/admin/site-pages"><i class="bx bx-file-blank"></i>{{T "admin.nav.site_pages"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "announcements"}}active{{end}}" data-nav="announcements" href="/admin/announcements"><i class="bx bx-news"></i>{{T "admin.nav.announcements"}}</a>
          </div>
        </div>
        <div class="nav-item has-sub {{if or (eq (index .Data "ActiveNav") "software_upgrade") (eq (index .Data "ActiveNav") "ipgeo_upgrade")}}is-active{{end}}" data-nav-group="upgrade">
          <button type="button" class="nav-link nav-parent {{if or (eq (index .Data "ActiveNav") "software_upgrade") (eq (index .Data "ActiveNav") "ipgeo_upgrade")}}active{{end}}" aria-haspopup="true">
            <i class="bx bx-cloud-upload"></i><span>{{T "admin.nav.group_upgrade"}}</span><i class="bx bx-chevron-right nav-caret"></i>
          </button>
          <div class="nav-flyout">
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "software_upgrade"}}active{{end}}" data-nav="software_upgrade" href="/admin/software-upgrade"><i class="bx bx-package"></i>{{T "admin.nav.software_upgrade"}}</a>
            <a class="nav-sublink {{if eq (index .Data "ActiveNav") "ipgeo_upgrade"}}active{{end}}" data-nav="ipgeo_upgrade" href="/admin/ipgeo-upgrade"><i class="bx bx-map"></i>{{T "admin.nav.ipgeo_upgrade"}}</a>
          </div>
        </div>
        <div class="nav-item">
          <a class="nav-link {{if eq (index .Data "ActiveNav") "product_agreement"}}active{{end}}" data-nav="product_agreement" href="/admin/product-agreement"><i class="bx bx-file"></i><span>{{T "admin.nav.product_agreement"}}</span></a>
        </div>
{{end}}

{{define "admin/layout_head"}}
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <meta name="format-detection" content="telephone=no">
  {{template "public_favicon_link" .}}
  <title>{{.Title}} - {{.ProductName}} {{T "admin.panel_title_suffix"}}</title>
  <meta name="author" content="{{.BrandTeam}} - {{.BrandHost}}">
  <link href="{{asset "/assets/css/bootstrap.min.css"}}" rel="stylesheet">
  <link href="{{asset "/assets/css/icons.css"}}" rel="stylesheet">
  <link href="{{asset "/assets/css/brand.css"}}" rel="stylesheet">
  <link href="{{asset "/assets/css/site-logo.css"}}" rel="stylesheet">
  <link href="{{asset "/assets/css/admin-panel.css"}}" rel="stylesheet">
  <link href="{{asset "/assets/css/user-area.css"}}" rel="stylesheet">
  <link href="{{asset "/assets/css/my-modal.css"}}" rel="stylesheet">
  {{template "public/privacy_mask_css" .}}
  <style>
    /* 对齐 NetCue：左侧固定侧栏（含 LOGO）+ 右侧内容区顶栏；hover 飞出子菜单 */
    body.ut-admin-layout {
      --ut-admin-sidebar-w: 240px;
      --ut-admin-topbar-h: 60px;
      --ut-admin-nav-bg: linear-gradient(180deg, #1e3a8a 0%, #1e40af 100%);
      --ut-admin-topbar-bg: #fff;
      --ut-admin-canvas: #f4f6f9;
      --ut-admin-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
      margin: 0;
      background: var(--ut-admin-canvas);
      font-family: var(--ut-admin-font);
      color: #0f172a;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    body.ut-admin-layout.admin-panel-body .admin-main {
      margin-left: 0;
      max-width: none;
      padding: 0;
    }
    body.ut-admin-layout .admin-sidebar {
      position: fixed !important;
      top: 0 !important;
      left: 0 !important;
      width: var(--ut-admin-sidebar-w) !important;
      max-width: var(--ut-admin-sidebar-w) !important;
      height: 100vh !important;
      max-height: 100vh !important;
      padding: 0 !important;
      z-index: 1000 !important;
      transform: none !important;
      box-shadow: 4px 0 24px rgba(15, 23, 42, 0.12);
      border-right: 1px solid rgba(255, 255, 255, 0.08);
      background: var(--ut-admin-nav-bg);
      overflow: visible !important;
      display: flex;
      flex-direction: column;
    }
    .admin-sidebar-brand {
      flex: 0 0 auto;
      padding: 1.35rem 1rem 1rem;
      border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    }
    .admin-sidebar-brand a {
      display: flex;
      align-items: center;
      gap: 0.65rem;
      color: #fff;
      text-decoration: none;
      min-width: 0;
    }
    .admin-sidebar-brand a:hover { color: #fff; opacity: 0.92; }
    .admin-sidebar-brand .admin-brand-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2rem;
      height: 2rem;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.14);
      border: 1px solid rgba(191, 219, 254, 0.28);
      flex-shrink: 0;
    }
    .admin-sidebar-brand .admin-brand-icon i {
      font-size: 1.1rem;
      color: #fff;
      line-height: 1;
    }
    .admin-sidebar-brand .admin-brand-text {
      display: flex;
      flex-direction: column;
      gap: 0.2rem;
      min-width: 0;
    }
    .admin-sidebar-brand .admin-brand-name {
      font-size: 1.05rem;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.25;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .admin-sidebar-brand .admin-brand-badge {
      align-self: flex-start;
      font-size: 0.6875rem;
      font-weight: 600;
      letter-spacing: 0.02em;
      color: #f8fafc;
      background: linear-gradient(135deg, rgba(56, 189, 248, 0.92), rgba(37, 99, 235, 0.88));
      border: 1px solid rgba(191, 219, 254, 0.45);
      border-radius: 999px;
      padding: 0.12rem 0.5rem;
      line-height: 1.35;
    }
    .admin-sidebar .admin-sidebar-nav {
      flex: 1 1 auto;
      padding: 0.85rem 0.7rem 1.25rem;
      overflow: visible;
    }
    .admin-sidebar .nav-item {
      position: relative;
      margin: 0;
    }
    .admin-sidebar .nav-link {
      display: flex;
      align-items: center;
      gap: 0.55rem;
      width: 100%;
      color: rgba(226, 232, 240, 0.92);
      border-radius: 10px;
      margin: 0.15rem 0;
      font-size: 0.9rem;
      font-weight: 500;
      letter-spacing: 0.01em;
      padding: 0.55rem 0.8rem 0.55rem 0.7rem;
      border: 1px solid transparent;
      background: transparent;
      text-align: left;
      font: inherit;
      cursor: pointer;
      text-decoration: none;
      transition: background 0.15s ease, color 0.15s ease;
    }
    .admin-sidebar .nav-link span {
      flex: 1;
      min-width: 0;
    }
    .admin-sidebar .nav-link i {
      font-size: 1.05rem;
      width: 1.1rem;
      text-align: center;
      color: #93c5fd;
      flex-shrink: 0;
    }
    .admin-sidebar .nav-link:hover,
    .admin-sidebar .nav-item.has-sub:hover > .nav-parent,
    .admin-sidebar .nav-item.has-sub.is-open > .nav-parent {
      background: rgba(255,255,255,0.08);
      color: #fff;
    }
    .admin-sidebar .nav-link.active,
    .admin-sidebar .nav-item.has-sub.is-active > .nav-parent {
      background: rgba(255, 255, 255, 0.12);
      color: #fff;
      font-weight: 600;
      border-color: rgba(147, 197, 253, 0.35);
      box-shadow: inset 3px 0 0 0 #60a5fa;
    }
    .admin-sidebar .nav-link.active i,
    .admin-sidebar .nav-item.has-sub.is-active > .nav-parent i { color: #fff; }
    .admin-sidebar .nav-caret {
      font-size: 1rem !important;
      width: auto !important;
      opacity: 0.65;
      margin-left: auto;
      flex: none !important;
      transition: opacity 0.15s;
    }
    .admin-sidebar .nav-item.has-sub:hover .nav-caret,
    .admin-sidebar .nav-item.has-sub.is-open .nav-caret,
    .admin-sidebar .nav-item.has-sub.is-active .nav-caret {
      opacity: 1;
      color: #fff;
    }
    .admin-sidebar .nav-flyout {
      position: absolute;
      left: calc(100% - 2px);
      top: 4px;
      min-width: 160px;
      width: max-content;
      max-width: 220px;
      background: #fff;
      color: #1c2130;
      border-radius: 0 8px 8px 0;
      box-shadow: 4px 6px 20px rgba(15, 23, 42, 0.16);
      padding: 6px 0 8px;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateX(6px);
      transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
      z-index: 1200;
    }
    .admin-sidebar .nav-flyout::before {
      content: "";
      position: absolute;
      left: -10px;
      top: 0;
      bottom: 0;
      width: 12px;
    }
    .admin-sidebar .nav-item.has-sub:hover > .nav-flyout,
    .admin-sidebar .nav-item.has-sub.is-open > .nav-flyout {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateX(0);
    }
    .admin-sidebar .nav-sublink {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.55rem 0.9rem;
      color: #374151;
      text-decoration: none;
      font-size: 0.875rem;
      font-weight: 500;
      letter-spacing: 0.01em;
      white-space: nowrap;
      transition: background 0.12s, color 0.12s;
    }
    .admin-sidebar .nav-sublink .bx {
      font-size: 1.05rem;
      color: #9ca3af;
      flex-shrink: 0;
      width: auto;
    }
    .admin-sidebar .nav-sublink:hover,
    .admin-sidebar .nav-sublink.active {
      background: #eff6ff;
      color: #1d4ed8;
    }
    .admin-sidebar .nav-sublink:hover .bx,
    .admin-sidebar .nav-sublink.active .bx {
      color: #2563eb;
    }
    .admin-topbar {
      position: fixed;
      top: 0;
      left: var(--ut-admin-sidebar-w);
      right: 0;
      height: var(--ut-admin-topbar-h);
      z-index: 999;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.75rem;
      padding: 0 1rem 0 1.1rem;
      background: var(--ut-admin-topbar-bg) !important;
      border-bottom: 1px solid #e5e8ef;
      box-shadow: 0 1px 0 rgba(15, 19, 32, 0.04);
      overflow: visible;
    }
    .admin-topbar .admin-topbar-title {
      margin: 0;
      font-size: 1.05rem;
      font-weight: 700;
      color: #0f172a;
      letter-spacing: -0.02em;
      line-height: 1.3;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .admin-topbar .admin-topbar-actions {
      display: flex;
      align-items: center;
      gap: 0.65rem;
      margin-left: auto;
      flex-shrink: 0;
    }
    /* 顶栏用户下拉（对齐前台 ut-nav-user；static 模式须手写 top:100%） */
    .admin-topbar .admin-topbar-actions,
    .admin-topbar .admin-topbar-actions .navbar-nav {
      overflow: visible;
      position: relative;
    }
    .admin-topbar .admin-topbar-user-dd {
      position: relative;
    }
    .admin-topbar .admin-topbar-user-toggle {
      color: #334155 !important;
      font-weight: 600;
      max-width: 12rem;
      padding: 0.3rem 0.45rem !important;
      border-radius: 10px;
      text-decoration: none !important;
    }
    .admin-topbar .admin-topbar-user-toggle:hover,
    .admin-topbar .admin-topbar-user-toggle:focus,
    .admin-topbar .admin-topbar-user-dd.show > .admin-topbar-user-toggle {
      color: #1d4ed8 !important;
      background: #eff6ff;
    }
    .admin-topbar .admin-topbar-user-toggle::after {
      margin-left: 0.2rem;
      vertical-align: 0.15em;
    }
    .admin-topbar .admin-topbar-user-name {
      color: inherit;
      font-size: 0.875rem;
      font-weight: 600;
      max-width: 7.5rem;
    }
    .admin-topbar .ut-nav-user-avatar {
      width: 2rem;
      height: 2rem;
      background: linear-gradient(145deg, rgba(37, 99, 235, 0.18), rgba(37, 99, 235, 0.06));
      color: #1d4ed8;
      font-size: 0.85rem;
      font-weight: 700;
      box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.12);
    }
    .admin-topbar .admin-topbar-user-menu {
      --bs-dropdown-min-width: 0;
      position: absolute !important;
      top: 100% !important;
      right: 0 !important;
      left: auto !important;
      bottom: auto !important;
      inset: auto 0 auto auto;
      transform: none !important;
      min-width: 0;
      width: max-content;
      margin-top: 0.45rem !important;
      padding: 0.35rem;
      background: #fff;
      border: 1px solid rgba(15, 23, 42, 0.1);
      border-radius: 12px;
      box-shadow:
        0 0 0 1px rgba(15, 23, 42, 0.03),
        0 4px 8px -2px rgba(15, 23, 42, 0.08),
        0 16px 40px rgba(15, 23, 42, 0.12);
      z-index: 1100;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-item {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      margin: 0.1rem 0;
      padding: 0.45rem 0.75rem;
      border-radius: 8px;
      font-size: 0.875rem;
      font-weight: 500;
      color: #0f172a;
      white-space: nowrap;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-item i {
      font-size: 1.05rem;
      opacity: 0.88;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-item:hover,
    .admin-topbar .admin-topbar-user-menu .dropdown-item:focus {
      background: rgba(37, 99, 235, 0.08);
      color: #2563eb;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-item:hover i,
    .admin-topbar .admin-topbar-user-menu .dropdown-item:focus i {
      color: #2563eb;
      opacity: 1;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-item.text-danger {
      color: #dc2626;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-item.text-danger:hover,
    .admin-topbar .admin-topbar-user-menu .dropdown-item.text-danger:focus {
      background: rgba(220, 38, 38, 0.08);
      color: #b91c1c;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-item.text-danger:hover i,
    .admin-topbar .admin-topbar-user-menu .dropdown-item.text-danger:focus i {
      color: #dc2626;
    }
    .admin-topbar .admin-topbar-user-menu .dropdown-divider {
      margin: 0.25rem 0.35rem;
      border-color: #e2e8f0;
      opacity: 1;
    }
    .ut-admin-main {
      margin-left: var(--ut-admin-sidebar-w);
      margin-top: var(--ut-admin-topbar-h);
      min-height: calc(100vh - var(--ut-admin-topbar-h));
      background: var(--ut-admin-canvas);
      padding: 0;
      display: flex;
      flex-direction: column;
      width: auto;
      max-width: none;
      box-sizing: border-box;
    }
    body.ut-admin-layout .ut-admin-main > .admin-content {
      width: 100%;
      max-width: none;
      box-sizing: border-box;
      background: transparent;
      border: none;
      box-shadow: none;
      border-radius: 0;
      padding: 1.25rem 1.5rem 1.75rem;
      min-height: 0;
      flex: 1 1 auto;
    }
    body.ut-admin-layout .admin-content .cs-admin-page {
      width: 100%;
      max-width: none;
    }
    body.ut-admin-layout .cs-admin-pagehead {
      margin-bottom: 1.25rem;
      padding: 1.2rem 1.35rem;
    }
    body.ut-admin-layout .cs-admin-section {
      margin-bottom: 1.25rem;
    }
    body.ut-admin-layout .cs-admin-section__head {
      padding: 0.95rem 1.25rem;
    }
    body.ut-admin-layout .cs-admin-section .table > :not(caption) > * > * {
      padding: 0.75rem 1rem;
      vertical-align: middle;
    }
    body.ut-admin-layout .cs-admin-section .table thead th {
      padding: 0.7rem 1rem;
    }
    body.ut-admin-layout .cs-admin-section .table tbody td {
      font-size: 0.875rem;
      color: #334155;
    }
    .ut-admin-inline-form .form-control,
    .ut-admin-inline-form .form-select {
      border-radius: 8px;
      border-color: rgba(148, 163, 184, 0.45);
    }
    .ut-admin-inline-form .btn {
      border-radius: 8px;
      font-weight: 600;
      font-size: 0.8125rem;
    }
    .ut-admin-code {
      font-size: 0.78rem;
      padding: 0.15em 0.45em;
      border-radius: 6px;
      background: #f1f5f9;
      color: #334155;
    }
    .ut-admin-switch-row__head {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 0.5rem 0.625rem;
      margin-bottom: 0.25rem;
    }
    .ut-admin-switch-row .form-check.form-switch {
      padding-left: 0;
      min-height: auto;
      display: flex;
      align-items: center;
    }
    .ut-admin-switch-row .form-check-input {
      width: 2.5em;
      height: 1.35em;
      margin: 0;
      cursor: pointer;
      float: none;
    }
    .ut-admin-switch-row .form-check-input:focus {
      box-shadow: 0 0 0 0.2rem rgba(37, 99, 235, 0.2);
    }
    .ut-sidebar-mobile--admin {
      background: #0f2744;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      overflow: visible;
      position: sticky;
      top: var(--ut-admin-topbar-h);
      z-index: 998;
    }
    .ut-sidebar-mobile--admin .ut-sidebar-mobile__scroll {
      overflow-x: auto;
      overflow-y: visible;
      display: flex;
      align-items: stretch;
      gap: 0.15rem;
      padding: 0.35rem 0.5rem;
    }
    .ut-sidebar-mobile--admin .nav-item {
      position: relative;
      flex: 0 0 auto;
    }
    .ut-sidebar-mobile--admin .nav-link {
      color: rgba(226, 232, 240, 0.92);
      white-space: nowrap;
      margin: 0;
    }
    .ut-sidebar-mobile--admin .nav-link i { color: #93c5fd; }
    .ut-sidebar-mobile--admin .nav-link.active,
    .ut-sidebar-mobile--admin .nav-item.has-sub.is-active > .nav-parent {
      background: rgba(255, 255, 255, 0.12);
      color: #fff;
      border-color: rgba(147, 197, 253, 0.35);
      box-shadow: inset 0 -2px 0 0 #60a5fa;
    }
    .ut-sidebar-mobile--admin .nav-link.active i,
    .ut-sidebar-mobile--admin .nav-item.has-sub.is-active > .nav-parent i { color: #fff; }
    .ut-sidebar-mobile--admin .nav-flyout {
      position: absolute;
      left: 0;
      top: calc(100% + 2px);
      min-width: 148px;
      border-radius: 8px;
      box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18);
      background: #fff;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(4px);
      z-index: 1300;
    }
    .ut-sidebar-mobile--admin .nav-item.has-sub:hover > .nav-flyout {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
    }
    .ut-sidebar-mobile--admin .nav-item.has-sub.is-open > .nav-flyout {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0);
    }
    .ut-sidebar-mobile--admin .nav-sublink { color: #374151; }
    .ut-sidebar-mobile--admin .nav-sublink .bx { color: #9ca3af; }
    .ut-sidebar-mobile--admin .nav-sublink:hover,
    .ut-sidebar-mobile--admin .nav-sublink.active {
      background: #eff6ff;
      color: #1d4ed8;
    }
    .ut-sidebar-mobile--admin .nav-sublink:hover .bx,
    .ut-sidebar-mobile--admin .nav-sublink.active .bx { color: #2563eb; }
    .dashboard-notices-wrap { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; }
    .dashboard-notices-wrap .notice-item {
      display: inline-flex; align-items: center; gap: 0.35rem;
      padding: 0.4rem 0.75rem; border-radius: 5px; font-size: 0.875rem;
      text-decoration: none; background: #f8f9fa; color: #212529;
      border: 1px solid #dee2e6; white-space: nowrap;
    }
    .dashboard-notices-wrap .notice-item:hover { border-color: #2563eb; }
    .dashboard-notices-wrap .notice-item .notice-pin { color: #2563eb; font-size: 0.9em; }
    .dashboard-notices-wrap .notice-item.txtblue { color: #0d6efd; border-color: rgba(13,110,253,.35); background: rgba(13,110,253,.06); }
    .dashboard-notices-wrap .notice-item.txtgreen { color: #198754; border-color: rgba(25,135,84,.35); background: rgba(25,135,84,.06); }
    .dashboard-notices-wrap .notice-item.txtred { color: #dc3545; border-color: rgba(220,53,69,.35); background: rgba(220,53,69,.06); }
    .dashboard-notices-wrap .notice-item.txtorange { color: #fd7e14; border-color: rgba(253,126,20,.35); background: rgba(253,126,20,.06); }
    .ut-admin-footer {
      margin-top: auto;
      padding: 1rem 0.5rem 1.15rem;
      text-align: center;
      font-size: 0.8125rem;
      line-height: 1.6;
      color: #94a3b8;
      background: transparent;
      border-top: 1px solid rgba(148, 163, 184, 0.35);
      border-radius: 0;
    }
    .ut-admin-footer a { color: #64748b; text-decoration: none; }
    .ut-admin-footer a:hover { color: #2563eb; }
    .ut-admin-footer-sep { opacity: 0.45; margin: 0 0.15rem; }
    #adminVersionModal .modal-content {
      border: 1px solid #dbe4f0;
      box-shadow: 0 12px 40px rgba(15, 39, 68, 0.2);
    }
    #adminVersionModal .modal-header {
      background: linear-gradient(135deg, #0f2744 0%, #132f57 48%, #1d4ed8 100%);
      color: #fff;
      border-bottom: 0;
    }
    #adminVersionModal .modal-header .bx { color: #93c5fd; }
    #adminVersionModal .btn-close { filter: invert(1); opacity: 0.85; }
    #adminVersionModal .admin-version-more {
      color: #2563eb;
      font-weight: 500;
      text-decoration: none;
    }
    #adminVersionModal .admin-version-more:hover {
      color: #1d4ed8;
      text-decoration: underline;
    }
    #adminVersionModal .admin-version-dismiss {
      color: #64748b;
      text-decoration: none;
    }
    #adminVersionModal .admin-version-dismiss:hover { color: #2563eb; }
    #adminVersionModal .btn-primary {
      background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
      border: none;
    }
    @media (max-width: 991.98px) {
      body.ut-admin-layout .admin-sidebar { display: none !important; }
      .admin-topbar {
        left: 0;
        padding: 0 0.75rem;
      }
      .ut-admin-main {
        margin-left: 0;
        padding: 0.5rem 0.5rem 0 !important;
      }
      body.ut-admin-layout .ut-admin-main > .admin-content {
        padding: 0.75rem 0.85rem 0.95rem;
      }
      .ut-admin-footer {
        padding: 0.9rem 0.35rem 1rem;
      }
    }
  </style>
  <script src="{{asset "/static/js/jquery.min.js"}}"></script>
    <link href="{{asset "/static/css/plain_text.css"}}" rel="stylesheet">
    <script src="{{asset "/static/js/plain_text.js"}}"></script>
  {{template "public/privacy_mask_js" .}}
  {{template "custom-head-embed" .}}
</head>
<body class="admin-panel-body ut-admin-layout" data-version="{{.Version}}" data-brand-url="{{.BrandURL}}">
<aside class="admin-sidebar d-none d-lg-flex" aria-label="{{T "admin.sidebar_aria"}}">
  <div class="admin-sidebar-brand">
    <a href="/admin" title="{{if .LogoText}}{{.LogoText}}{{else}}{{T "site_name"}}{{end}} {{T "admin.panel_title_suffix"}}">
      {{template "site-logo-admin" .}}
      <span class="admin-brand-badge">{{T "admin.brand_badge"}}</span>
    </a>
  </div>
  <nav class="nav flex-column admin-sidebar-nav" id="adminNavMenu">
    {{template "admin_sidebar_nav_links" .}}
  </nav>
</aside>

<header class="admin-topbar">
  <h1 class="admin-topbar-title">{{.Title}}</h1>
  <div class="admin-topbar-actions">
    <ul class="navbar-nav flex-row align-items-center mb-0">
      {{template "admin/nav_user_bar_frag" .}}
    </ul>
  </div>
</header>
{{template "public/logout_confirm_bootstrap_frag" .}}

<nav class="ut-sidebar-mobile ut-sidebar-mobile--admin d-lg-none" aria-label="{{T "admin.nav_mobile_aria"}}">
  <div class="ut-sidebar-mobile__scroll nav" id="adminNavMenuMobile">
    {{template "admin_sidebar_nav_links" .}}
  </div>
</nav>

<main class="ut-admin-main">
  <div class="admin-content">
{{end}}

{{define "admin_pagehead"}}
<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 {{.Icon}}"></i></div>
    <div class="cs-admin-pagehead__body">
      <h1 class="cs-admin-pagehead__title">{{.Title}}</h1>
      {{with .Desc}}<p class="cs-admin-pagehead__desc">{{.}}</p>{{end}}
    </div>
  </div>
  {{with .Links}}<div class="cs-admin-pagehead__links">{{.}}</div>{{end}}
</header>
{{end}}

{{define "admin/layout_foot"}}
  </div>
  <footer class="ut-admin-footer">
    <span>&copy; {{.Year}} <a href="/" target="_blank" rel="noopener">{{if .LogoText}}{{.LogoText}}{{else}}{{T "site_name"}}{{end}}</a>. All Rights Reserved.</span>
    <span class="ut-admin-footer-sep"> · </span>
    <span>Powered by <a href="{{.BrandURL}}" target="_blank" rel="noopener noreferrer" title="{{.BrandTeam}}">{{.BrandTeam}}</a></span>
    <span class="ut-admin-footer-sep"> · </span>
    <span>{{if .ProductDetailURL}}<a href="{{.ProductDetailURL}}" target="_blank" rel="noopener noreferrer" title="{{.ProductName}}">{{.ProductName}}</a>{{else}}{{.ProductName}}{{end}}{{if and .IsPro .EditionName}}&nbsp;{{.EditionName}}{{end}}&nbsp;v{{.Version}}</span>
  </footer>
</main>
{{template "public/back_to_top_frag" .}}
<div class="modal fade" id="adminBsDialogModal" tabindex="-1" aria-labelledby="adminBsDialogModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content border-0 shadow">
      <div class="modal-header border-0 pb-0">
        <h2 class="modal-title fs-6 fw-semibold admin-bs-dialog-title" id="adminBsDialogModalLabel"></h2>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{{T "modal_close_aria"}}"></button>
      </div>
      <div class="modal-body pt-2 pb-2 text-secondary small admin-bs-dialog-body"></div>
      <div class="modal-footer border-0 pt-0 gap-2">
        <button type="button" class="btn btn-light btn-sm admin-bs-dialog-cancel" data-bs-dismiss="modal">{{T "btn_cancel"}}</button>
        <button type="button" class="btn btn-primary btn-sm admin-bs-dialog-ok">{{T "btn_confirm"}}</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="adminVersionModal" tabindex="-1" aria-labelledby="adminVersionModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content border-0 shadow">
      <div class="modal-header">
        <h2 class="modal-title fs-6 fw-semibold" id="adminVersionModalLabel"><i class="bx bx-up-arrow-circle me-1"></i><span class="admin-version-title"></span></h2>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{{T "admin_version_close_aria"}}"></button>
      </div>
      <div class="modal-body">
        <div class="admin-version-tips text-secondary small mb-2 d-none"></div>
        <div><a class="admin-version-more" href="#" target="_blank" rel="noopener">{{T "admin_version_learn_more"}}</a></div>
      </div>
      <div class="modal-footer border-0 pt-0">
        <button type="button" class="btn btn-sm btn-link admin-version-dismiss">{{T "admin_version_dismiss"}}</button>
        <button type="button" class="btn btn-sm btn-primary" data-bs-dismiss="modal">{{T "admin_version_close_btn"}}</button>
      </div>
    </div>
  </div>
</div>
<script src="{{asset "/assets/js/bootstrap.bundle.min.js"}}"></script>
<script src="{{asset "/assets/js/my-modal.js"}}"></script>
<script src="{{asset "/assets/js/app-toast.js"}}"></script>
<script src="{{asset "/static/js/sc-session-guard.js"}}"></script>
<script>
(function() {
  var modalEl = document.getElementById('adminBsDialogModal');
  if (!modalEl || !window.bootstrap || typeof bootstrap.Modal !== 'function') return;
  var titleEl = modalEl.querySelector('.admin-bs-dialog-title');
  var bodyEl = modalEl.querySelector('.admin-bs-dialog-body');
  var btnOk = modalEl.querySelector('.admin-bs-dialog-ok');
  var btnCancel = modalEl.querySelector('.admin-bs-dialog-cancel');
  var pending = null;

  function settle(val) {
    var fn = pending;
    pending = null;
    if (fn) fn(val);
  }

  btnOk.addEventListener('click', function () {
    bootstrap.Modal.getOrCreateInstance(modalEl).hide();
    settle(true);
  });
  modalEl.addEventListener('hidden.bs.modal', function () {
    if (pending) settle(false);
  });

  var adminDialogI18n = {
    confirmTitle: {{json (T "admin.dialog.confirm_title")}},
    alertTitle: {{json (T "admin.dialog.alert_title")}},
    ok: {{json (T "admin.dialog.ok")}},
    gotIt: {{json (T "admin.dialog.got_it")}},
    cancel: {{json (T "btn_cancel")}}
  };
  function showDialog(opts, isConfirm) {
    opts = opts || {};
    if (titleEl) titleEl.textContent = opts.title || (isConfirm ? adminDialogI18n.confirmTitle : adminDialogI18n.alertTitle);
    if (bodyEl) bodyEl.textContent = opts.message || '';
    if (btnOk) {
      btnOk.textContent = opts.okText || (isConfirm ? adminDialogI18n.ok : adminDialogI18n.gotIt);
      btnOk.className = 'btn btn-sm admin-bs-dialog-ok ' + (opts.okClass || 'btn-primary');
    }
    if (btnCancel) {
      btnCancel.classList.toggle('d-none', !isConfirm);
      btnCancel.textContent = opts.cancelText || adminDialogI18n.cancel;
    }
    return new Promise(function (resolve) {
      pending = resolve;
      bootstrap.Modal.getOrCreateInstance(modalEl).show();
    });
  }

  window.adminBsConfirm = function (opts) { return showDialog(opts, true); };
  window.adminBsAlert = function (opts) { return showDialog(opts, false); };
})();
(function() {
  function bindAdminNavMenu(menu) {
    if (!menu) return;
    menu.addEventListener('click', function (e) {
      var parentBtn = e.target.closest('.nav-parent');
      if (!parentBtn) return;
      var item = parentBtn.closest('.nav-item.has-sub');
      if (!item) return;
      var isTouch = window.matchMedia('(hover: none), (max-width: 991.98px)').matches;
      if (!isTouch && menu.id === 'adminNavMenu') return;
      e.preventDefault();
      var open = item.classList.contains('is-open');
      menu.querySelectorAll('.nav-item.has-sub.is-open').forEach(function (el) {
        el.classList.remove('is-open');
      });
      if (!open) item.classList.add('is-open');
    });
  }
  bindAdminNavMenu(document.getElementById('adminNavMenu'));
  bindAdminNavMenu(document.getElementById('adminNavMenuMobile'));
  document.addEventListener('click', function (e) {
    if (e.target.closest('#adminNavMenu') || e.target.closest('#adminNavMenuMobile')) return;
    document.querySelectorAll('.nav-item.has-sub.is-open').forEach(function (el) {
      el.classList.remove('is-open');
    });
  });
})();
(function() {
  var versionI18n = {
    newFallback: {{json (T "admin_version_new_fallback")}}
  };
  fetch('/admin/version-check', { method: 'GET', credentials: 'same-origin' })
    .then(function(res) { return res.ok ? res.json() : res.json().catch(function() { return { success: false }; }); })
    .then(function(ret) {
      if (!ret || !ret.success || !ret.data) return;
      var d = ret.data;
      if (!d.has_update || d.suppress_prompt || !d.latest) return;
      var fallbackTitle = String(versionI18n.newFallback || '').replace('%s', d.latest);
      var title = (d.title && d.title.trim()) ? d.title.trim() : fallbackTitle;
      var tips = (d.update_tips && d.update_tips.trim()) ? d.update_tips.trim() : '';
      var latest = d.latest;
      var moreUrl = (d.href && d.href.trim()) ? d.href.trim() : '';
      if (moreUrl.indexOf('http://') !== 0 && moreUrl.indexOf('https://') !== 0) moreUrl = '';
      if (!moreUrl) moreUrl = document.body.getAttribute('data-brand-url') || '';
      var modalEl = document.getElementById('adminVersionModal');
      if (!modalEl || !window.bootstrap || typeof bootstrap.Modal !== 'function') return;
      var titleEl = modalEl.querySelector('.admin-version-title');
      var tipsEl = modalEl.querySelector('.admin-version-tips');
      var moreEl = modalEl.querySelector('.admin-version-more');
      var dismissEl = modalEl.querySelector('.admin-version-dismiss');
      if (titleEl) titleEl.textContent = title;
      if (tipsEl) {
        tipsEl.textContent = tips;
        tipsEl.classList.toggle('d-none', !tips);
      }
      if (moreEl) {
        moreEl.href = moreUrl || '#';
        moreEl.classList.toggle('d-none', !moreUrl);
      }
      var skipCloseDismiss = false;
      if (dismissEl) {
        dismissEl.onclick = function() {
          skipCloseDismiss = true;
          fetch('/admin/version-dismiss?type=version&v=' + encodeURIComponent(latest), { method: 'GET', credentials: 'same-origin' }).catch(function() {});
          bootstrap.Modal.getOrCreateInstance(modalEl).hide();
        };
      }
      modalEl.addEventListener('hidden.bs.modal', function onCloseOnce() {
        modalEl.removeEventListener('hidden.bs.modal', onCloseOnce);
        if (!skipCloseDismiss) {
          fetch('/admin/version-dismiss?type=close', { method: 'GET', credentials: 'same-origin' }).catch(function() {});
        }
      });
      bootstrap.Modal.getOrCreateInstance(modalEl).show();
    })
    .catch(function() {});
})();
</script>
</body>
</html>
{{end}}