<!DOCTYPE html>
<html lang="bn">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, viewport-fit=cover" />
  <meta name="theme-color" content="#ffffff" />
  <meta name="mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="format-detection" content="telephone=no" />
  <meta name="robots" content="noindex, nofollow, noarchive, nosnippet" />
  <link rel="canonical" href="https://alltrustedshop.store/admin.html" />
  <style>
    /* Mobile/PC rendering optimization — does NOT change layout or design */
    html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; }
    body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; }
    img, video { max-width: 100%; height: auto; }
    button, a, [role="button"], input[type="button"], input[type="submit"] { touch-action: manipulation; }
    * { -webkit-tap-highlight-color: rgba(0,0,0,0); }
  </style>
  <title>Admin Panel — A.T Shop</title>
  
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  <link rel="preconnect" href="https://cdnjs.cloudflare.com" crossorigin />
  <!-- Bengali font preload removed: Google Fonts serves browser-specific woff2 URLs,
       so a hardcoded one is often "unused" / 404. The stylesheet below still loads the right file. -->
  <!--
  <link rel="preload" as="font" type="font/woff2"
    href="https://fonts.gstatic.com/s/notosansbengali/v26/Cn-SJsCGWQxOjaGwMQ6fIiMywrNJIky6nvd8BjzVMvJx2mcSPVFpVEqE-6KmsolKudCk8izI0lc.woff2"
    crossorigin />
  -->
  <link rel="preload" as="style"
    href="https://fonts.googleapis.com/css2?family=Noto+Sans+Bengali:wght@300;400;500;600;700&display=swap"
    onload="this.onload=null;this.rel='stylesheet'" />
  <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Noto+Sans+Bengali:wght@300;400;500;600;700&display=swap" /></noscript>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" media="print" onload="this.media='all'" />
  <noscript><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" /></noscript>

  
  <style>
    @font-face {
      font-family: 'Noto Sans Bengali Fallback';
      src: local('Arial'), local('Segoe UI'), local('Helvetica');
      size-adjust: 105.4%; ascent-override: 101%; descent-override: 28%; line-gap-override: 0%;
    }
  </style>
  <style>
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: 'Noto Sans Bengali', 'Noto Sans Bengali Fallback', system-ui, 'Segoe UI', Arial, sans-serif; background: #f1f5f9; color: #1e293b; }
    .fa, .fas, .far, .fab, [class^="fa-"] { font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands' !important; }
    :root {
      --primary: #6c63ff; --primary-dark: #5548e0; --secondary: #ff6b6b;
      --accent: #ffd93d; --dark: #1a1a2e; --success: #10b981; --warning: #f59e0b;
      --danger: #ef4444; --sidebar-w: 260px;
    }
    ::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 3px; }

    /* ── LOGIN PAGE ── */
    #loginPage {
      position: fixed; inset: 0; background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
      display: flex; align-items: center; justify-content: center; z-index: 9999;
    }
    .login-card {
      background: rgba(255,255,255,0.07); backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,0.12);
      border-radius: 20px; padding: 48px 40px; width: 100%; max-width: 420px; text-align: center;
    }
    .login-logo { font-size: 2rem; font-weight: 700; background: linear-gradient(135deg,#fff,#ffd93d); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 8px; }
    .login-sub { color: #94a3b8; font-size: 0.85rem; margin-bottom: 32px; }
    .login-field { margin-bottom: 16px; text-align: left; }
    .login-field label { display: block; color: #94a3b8; font-size: 0.85rem; margin-bottom: 6px; }
    .login-field input { width: 100%; background: rgba(255,255,255,0.08); border: 1.5px solid rgba(255,255,255,0.15); color: #fff; padding: 12px 16px; border-radius: 10px; font-family: inherit; font-size: 0.95rem; transition: all 0.2s; }
    .login-field input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(108,99,255,0.2); }
    .login-field input::placeholder { color: #64748b; }
    .login-btn { width: 100%; background: linear-gradient(135deg,var(--primary),var(--primary-dark)); color: #fff; border: none; padding: 14px; border-radius: 10px; font-family: inherit; font-size: 1rem; font-weight: 700; cursor: pointer; transition: all 0.2s; margin-top: 8px; }
    .login-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(108,99,255,0.4); }
    #loginError { color: var(--secondary); font-size: 0.85rem; margin-top: 10px; }

    /* ── MAIN LAYOUT ── */
    #adminApp { display: none; }
    .admin-layout { display: flex; min-height: 100vh; }

    /* ── SIDEBAR ── */
    .sidebar {
      width: var(--sidebar-w); background: var(--dark); color: #fff; position: fixed; top: 0; left: 0; height: 100vh; overflow-y: auto;
      display: flex; flex-direction: column; z-index: 100; transition: transform 0.3s;
      will-change: transform; -webkit-overflow-scrolling: touch;
    }
    .sidebar-logo { padding: 24px 20px; border-bottom: 1px solid rgba(255,255,255,0.08); }
    .sidebar-logo-text { font-size: 1.4rem; font-weight: 700; background: linear-gradient(135deg,#fff,#ffd93d); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
    .sidebar-logo-sub { font-size: 0.7rem; color: #a78bfa; letter-spacing: 2px; }
    .sidebar-nav { flex: 1; padding: 16px 0; }
    .nav-section { padding: 8px 20px; font-size: 0.7rem; color: #64748b; text-transform: uppercase; letter-spacing: 1.5px; font-weight: 600; margin-top: 8px; }
    .nav-item { display: flex; align-items: center; gap: 12px; padding: 11px 20px; color: #94a3b8; cursor: pointer; transition: all 0.2s; font-size: 0.92rem; border-left: 3px solid transparent; }
    .nav-item:hover { color: #fff; background: rgba(255,255,255,0.06); }
    .nav-item.active { color: #fff; background: rgba(108,99,255,0.15); border-left-color: var(--primary); }
    .nav-item i { width: 20px; text-align: center; font-size: 1rem; }

    /* Collapsible group */
    .nav-group-header {
      display: flex; align-items: center; gap: 12px;
      padding: 12px 20px; color: #e2e8f0; cursor: pointer;
      font-size: 0.92rem; font-weight: 700;
      background: rgba(255,255,255,0.04);
      border-left: 3px solid transparent;
      border-top: 1px solid rgba(255,255,255,0.06);
      transition: background 0.2s;
      user-select: none;
      margin-top: 4px;
    }
    .nav-group-header:hover { background: rgba(255,255,255,0.09); }
    .nav-group-header i.group-icon { width: 20px; text-align: center; font-size: 1rem; color: #a78bfa; }
    .nav-group-header .group-arrow {
      margin-left: auto; font-size: 0.75rem; color: #64748b;
      transition: transform 0.22s ease;
    }
    .nav-group-header.open .group-arrow { transform: rotate(180deg); }
    .nav-group-body {
      overflow: hidden;
      max-height: 0;
      transition: max-height 0.28s ease;
    }
    .nav-group-body.open { max-height: 600px; }
    .nav-group-body .nav-item { padding-left: 48px; font-size: 0.88rem; }
    .sidebar-footer { padding: 16px 20px; border-top: 1px solid rgba(255,255,255,0.08); }
    .logout-btn { display: flex; align-items: center; gap: 8px; color: #94a3b8; cursor: pointer; font-size: 0.9rem; padding: 8px 0; }
    .logout-btn:hover { color: var(--secondary); }

    /* ── MAIN CONTENT ── */
    .main-content { margin-left: var(--sidebar-w); flex: 1; min-height: 100vh; }
    .top-bar { background: #fff; padding: 16px 28px; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 1px 4px rgba(0,0,0,0.06); position: sticky; top: 0; z-index: 50; }
    .top-bar-title { font-size: 1.1rem; font-weight: 700; color: #1e293b; }
    .top-bar-right { display: flex; align-items: center; gap: 12px; }
    .admin-badge { background: linear-gradient(135deg,var(--primary),var(--primary-dark)); color: #fff; padding: 6px 14px; border-radius: 50px; font-size: 0.8rem; font-weight: 600; }
    .page-content { padding: 28px; }

    /* ── DASHBOARD CARDS ── */
    .stats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; margin-bottom: 28px; }
    .stat-card { background: #fff; border-radius: 14px; padding: 24px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); display: flex; align-items: center; gap: 16px; }
    .stat-icon { width: 52px; height: 52px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; flex-shrink: 0; }
    .stat-icon.purple { background: rgba(108,99,255,0.12); color: var(--primary); }
    .stat-icon.green { background: rgba(16,185,129,0.12); color: var(--success); }
    .stat-icon.orange { background: rgba(245,158,11,0.12); color: var(--warning); }
    .stat-icon.red { background: rgba(239,68,68,0.12); color: var(--danger); }
    .stat-num { font-size: 1.8rem; font-weight: 700; color: #1e293b; }
    .stat-label { font-size: 0.82rem; color: #64748b; margin-top: 2px; }

    /* ── SECTION CARDS ── */
    .section-card { background: #fff; border-radius: 14px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); overflow: hidden; margin-bottom: 24px; }
    .section-header { padding: 18px 24px; border-bottom: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
    .section-header h3 { font-size: 1rem; font-weight: 700; color: #1e293b; }
    .section-body { padding: 24px; }

    /* ── BUTTONS ── */
    .btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 18px; border-radius: 8px; border: none; font-family: inherit; font-size: 0.88rem; font-weight: 600; cursor: pointer; transition: all 0.2s; }
    .btn-primary { background: var(--primary); color: #fff; }
    .btn-primary:hover { background: var(--primary-dark); transform: translateY(-1px); }
    .btn-success { background: var(--success); color: #fff; }
    .btn-success:hover { background: #059669; }
    .btn-danger { background: var(--danger); color: #fff; }
    .btn-danger:hover { background: #dc2626; }
    .btn-warning { background: var(--warning); color: #fff; }
    .btn-sm { padding: 6px 12px; font-size: 0.8rem; }
    .btn-outline { background: transparent; border: 1.5px solid #e2e8f0; color: #64748b; }
    .btn-outline:hover { border-color: var(--primary); color: var(--primary); }

    /* ── FORM ELEMENTS ── */
    .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .form-full { grid-column: 1 / -1; }
    .form-group { margin-bottom: 16px; }
    .form-label { display: block; font-size: 0.85rem; font-weight: 600; color: #374151; margin-bottom: 6px; }
    .form-label span { color: var(--danger); }
    .form-control { width: 100%; padding: 10px 14px; border: 1.5px solid #e2e8f0; border-radius: 8px; font-family: inherit; font-size: 0.9rem; color: #1e293b; transition: all 0.2s; background: #fff; }
    .form-control:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(108,99,255,0.1); }
    select.form-control { cursor: pointer; }
    textarea.form-control { resize: vertical; min-height: 80px; }
    .toggle-group { display: flex; align-items: center; gap: 10px; }
    .toggle { width: 44px; height: 24px; background: #e2e8f0; border-radius: 50px; position: relative; cursor: pointer; transition: all 0.2s; border: none; }
    .toggle.on { background: var(--primary); }
    .toggle::after { content: ''; position: absolute; width: 18px; height: 18px; background: #fff; border-radius: 50%; top: 3px; left: 3px; transition: all 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.2); }
    .toggle.on::after { left: 23px; }

    /* ── PRODUCT TABLE ── */
    .product-table { width: 100%; border-collapse: collapse; }
    .product-table th { background: #f8fafc; padding: 12px 16px; text-align: left; font-size: 0.8rem; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 2px solid #f1f5f9; white-space: nowrap; }
    .product-table td { padding: 14px 16px; border-bottom: 1px solid #f8fafc; font-size: 0.88rem; color: #374151; vertical-align: middle; }
    .product-table tr:hover td { background: #fafbff; }
    .product-thumb { width: 48px; height: 48px; border-radius: 8px; object-fit: cover; background: #f1f5f9; }
    .product-thumb-placeholder { width: 48px; height: 48px; border-radius: 8px; background: linear-gradient(135deg,#e0e7ff,#ede9fe); display: flex; align-items: center; justify-content: center; color: #7c3aed; font-size: 1.2rem; }
    .badge-status { padding: 3px 10px; border-radius: 50px; font-size: 0.75rem; font-weight: 700; }
    .badge-active { background: #d1fae5; color: #065f46; }
    .badge-inactive { background: #fee2e2; color: #991b1b; }
    .actions-cell { display: flex; gap: 6px; align-items: center; }

    /* ── SEARCH BAR ── */
    .search-box { position: relative; }
    .search-box input { padding-left: 36px; min-width: 240px; }
    .search-box i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #94a3b8; font-size: 0.9rem; }

    /* ── MODAL ── */
    .modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 1000; align-items: center; justify-content: center; padding: 12px; overflow-y: auto; -webkit-overflow-scrolling: touch; will-change: opacity; }
    .modal-overlay.open { display: flex; }
    .modal-box { background: #fff; border-radius: 16px; width: 100%; max-width: 720px; max-height: calc(100vh - 24px); display: flex; flex-direction: column; overflow: hidden; margin: auto; }
    .modal-header { padding: 16px 20px; border-bottom: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; background: #fff; z-index: 1; flex-shrink: 0; }
    .modal-header h3 { font-size: 1.1rem; font-weight: 700; }
    .modal-close { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background: #f1f5f9; border-radius: 50%; cursor: pointer; border: none; color: #64748b; flex-shrink: 0; }
    .modal-close:hover { background: #e2e8f0; }
    .modal-body { padding: 20px; overflow-y: auto; -webkit-overflow-scrolling: touch; flex: 1; }
    .modal-footer { padding: 12px 20px; border-top: 1px solid #f1f5f9; display: flex; justify-content: flex-end; gap: 10px; flex-shrink: 0; flex-wrap: wrap; }

    /* ── SPEC TABLE BUILDER ── */
    .spec-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; margin-bottom: 8px; align-items: center; }
    .spec-row input { padding: 8px 12px; border: 1.5px solid #e2e8f0; border-radius: 6px; font-family: inherit; font-size: 0.85rem; }
    .spec-row input:focus { outline: none; border-color: var(--primary); }
    .spec-remove { width: 32px; height: 32px; background: #fef2f2; border: none; color: var(--danger); border-radius: 6px; cursor: pointer; display: flex; align-items: center; justify-content: center; }

    /* ── GALLERY PREVIEW ── */
    .gallery-grid { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
    .gallery-item { position: relative; }
    .gallery-item img { width: 80px; height: 80px; object-fit: cover; border-radius: 8px; border: 2px solid #e2e8f0; }
    .gallery-remove { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; background: var(--danger); color: #fff; border: none; border-radius: 50%; cursor: pointer; font-size: 0.65rem; display: flex; align-items: center; justify-content: center; }

    /* ── ORDERS TABLE ── */
    .order-status { padding: 3px 10px; border-radius: 50px; font-size: 0.75rem; font-weight: 700; }
    .order-pending { background: #fef3c7; color: #92400e; }
    .order-confirmed { background: #d1fae5; color: #065f46; }
    .order-shipped { background: #dbeafe; color: #1e40af; }
    .order-delivered { background: #d1fae5; color: #065f46; }
    .order-cancelled { background: #fee2e2; color: #991b1b; }

    /* ── RESELLER ORDER STATUS / COMMISSION BADGES ── */
    .ro-pending { background: #fef3c7; color: #92400e; }
    .ro-confirmed { background: #d1fae5; color: #065f46; }
    .ro-processing { background: #e0e7ff; color: #4338ca; }
    .ro-shipped { background: #dbeafe; color: #1e40af; }
    .ro-delivered { background: #d1fae5; color: #065f46; }
    .ro-cancelled { background: #fee2e2; color: #991b1b; }
    .comm-unpaid { background: #fef3c7; color: #92400e; }
    .comm-held { background: #fee2e2; color: #991b1b; }
    .comm-credited { background: #d1fae5; color: #065f46; }

    /* ── TOAST ── */
    .a-toast { position: fixed; bottom: 24px; right: 24px; background: #1e293b; color: #fff; padding: 12px 20px; border-radius: 10px; font-size: 0.88rem; font-weight: 600; z-index: 9999; transform: translateY(100px); opacity: 0; transition: all 0.3s; display: flex; align-items: center; gap: 8px; min-width: 240px; }
    .a-toast.show { transform: translateY(0); opacity: 1; }
    .a-toast.success i { color: #10b981; }
    .a-toast.error i { color: #ef4444; }

    /* ── LOADING SPINNER ── */
    .spinner { width: 36px; height: 36px; border: 4px solid #e2e8f0; border-top-color: var(--primary); border-radius: 50%; animation: spin 0.7s linear infinite; margin: 0 auto; }
    @keyframes spin { to { transform: rotate(360deg); } }
    .loading-wrap { text-align: center; padding: 40px; }

    /* ── CLOUDINARY WIDGET STYLE ── */
    .img-upload-btn { display: flex; align-items: center; gap:8px; padding: 10px 16px; background: linear-gradient(135deg,#0ea5e9,#2563eb); color: #fff; border: none; border-radius: 8px; font-family: inherit; font-size: 0.88rem; font-weight: 600; cursor: pointer; }
    .img-preview { width: 100%; max-width: 200px; height: 120px; object-fit: cover; border-radius: 8px; border: 2px solid #e2e8f0; margin-top: 8px; }

    /* ── SETTINGS PAGE ── */
    .settings-section { background: #fff; border-radius: 14px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); padding: 24px; margin-bottom: 20px; }
    .settings-section h4 { font-size: 1rem; font-weight: 700; margin-bottom: 16px; color: #1e293b; padding-bottom: 10px; border-bottom: 1px solid #f1f5f9; }

    /* ── PAGINATION ── */
    .pagination { display: flex; gap: 6px; align-items: center; justify-content: center; margin-top: 20px; flex-wrap: wrap; }
    .page-btn { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 8px; border: 1.5px solid #e2e8f0; background: #fff; cursor: pointer; font-size: 0.85rem; font-weight: 600; color: #374151; }
    .page-btn.active { background: var(--primary); color: #fff; border-color: var(--primary); }
    .page-btn:hover:not(.active) { border-color: var(--primary); color: var(--primary); }

    .sidebar-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 99; }
    @media (max-width: 768px) {
      .sidebar { transform: translateX(-100%); transition: transform 0.25s ease; z-index: 100; }
      .sidebar.open { transform: translateX(0); box-shadow: 4px 0 24px rgba(0,0,0,0.35); }
      .sidebar-backdrop.open { display: block; }
      .main-content { margin-left: 0; }
      .form-grid { grid-template-columns: 1fr; }
      .stats-grid { grid-template-columns: 1fr 1fr; }
      .product-table { display: block; overflow-x: auto; }
      .modal-overlay { padding: 8px; align-items: flex-end; }
      .modal-box { max-height: calc(100vh - 16px); border-radius: 16px 16px 12px 12px; }
      .top-bar { padding: 10px 14px; flex-wrap: wrap; gap: 8px; }
      .page-content { padding: 14px; }
      .section-header { flex-direction: column; align-items: flex-start; }
      .search-box input { min-width: 0; width: 100%; }
      .a-toast { left: 12px; right: 12px; bottom: 16px; min-width: 0; width: auto; }
      .admin-badge { font-size: 0.72rem; padding: 5px 10px; }
      #sidebarToggle { display: flex !important; align-items: center; justify-content: center; }
      /* mobile card layout */
      .mob-card-list { display: flex; flex-direction: column; gap: 12px; padding: 14px; }
      .mob-card { background:#fff; border-radius:14px; box-shadow:0 1px 6px rgba(0,0,0,0.08); padding:14px 16px; border:1px solid #f1f5f9; }
      .mob-card-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; gap:8px; }
      .mob-card-id { font-family:monospace; font-size:0.78rem; color:#64748b; background:#f8fafc; padding:3px 8px; border-radius:6px; }
      .mob-card-row { display:flex; justify-content:space-between; align-items:center; padding:5px 0; border-bottom:1px solid #f8fafc; font-size:0.875rem; gap:8px; }
      .mob-card-row:last-child { border-bottom:none; }
      .mob-card-label { color:#94a3b8; font-size:0.78rem; flex-shrink:0; }
      .mob-card-val { font-weight:600; text-align:right; word-break:break-word; }
      .mob-card-actions { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
      .mob-card-actions .btn { flex:1; min-width:80px; justify-content:center; font-size:0.82rem; }
      .mob-card-title { font-weight:700; font-size:0.95rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:60vw; }
      .mob-card-name { font-weight:700; font-size:0.9rem; }
      .mob-card-sub { font-size:0.78rem; color:#64748b; margin-top:1px; }
      .mob-price { color:var(--primary); font-weight:800; font-size:1rem; }
      .mob-earn { color:var(--success); font-weight:700; }
      /* মোবাইলে table hide করে card দেখানো */
      .mobile-hide-table { display:none !important; }
      .section-card > div[style*="overflow-x:auto"] { padding:0; }
      /* filter row মোবাইলে stack */
      .section-header > div { flex-direction:column; align-items:stretch; }
      .section-header > div .search-box { width:100%; }
      .section-header > div select,
      .section-header > div .btn { width:100%; }
    }
    @media (max-width: 480px) {
      .stats-grid { grid-template-columns: 1fr; }
      .spec-row { grid-template-columns: 1fr 1fr auto; }
      .modal-body { padding: 14px; }
      .modal-header { padding: 12px 14px; }
      .modal-footer { padding: 10px 14px; }
    }

    /* Pages visibility */
    .admin-page { display: none; }
    .admin-page.active { display: block; }
  </style>
</head>
<body>
  
  <script>
    (function () {
      var FALLBACK_IMG = 'data:image/svg+xml;utf8,' + encodeURIComponent(
        '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80">' +
        '<rect width="80" height="80" fill="#eef2f7"/>' +
        '<text x="40" y="46" text-anchor="middle" font-size="10" fill="#94a3b8">N/A</text></svg>');
      document.addEventListener('error', function (e) {
        var el = e.target; if (!el) return;
        if (el.tagName === 'IMG' && el.src !== FALLBACK_IMG) {
          console.warn('[asset 404]', el.src);
          el.src = FALLBACK_IMG; el.removeAttribute('srcset');
        } else if (el.tagName === 'SCRIPT' || el.tagName === 'LINK') {
          console.warn('[asset 404]', el.src || el.href);
        }
      }, true);
    })();
  </script>

  <!-- =====================================================
       CLOUDINARY IMAGE OPTIMIZATION HELPER
       Same helper as index.html — single source of truth per-file.
       Transforms /upload/ → /upload/f_auto,q_auto:good,w_auto,dpr_auto,c_limit/
       on every Cloudinary URL. Non-Cloudinary URLs pass through unchanged.
  ===================================================== -->
  <script>
    window.optimizeCloudinaryUrl = function optimizeCloudinaryUrl(url) {
      if (!url || typeof url !== 'string') return url;
      if (!/res\.cloudinary\.com/i.test(url) || url.indexOf('/upload/') === -1) return url;
      var uploadIdx = url.indexOf('/upload/');
      var afterUpload = url.slice(uploadIdx + 8);
      var firstSegment = afterUpload.split('/')[0];
      if (firstSegment && /^[a-z_,.:0-9]+$/i.test(firstSegment) && firstSegment.indexOf('_') !== -1) {
        return url; // Already has transformations
      }
      return url.slice(0, uploadIdx + 8) + 'f_auto,q_auto:good,w_auto,dpr_auto,c_limit/' + afterUpload;
    };
  </script>

<!-- ===== LOGIN PAGE ===== -->
<div id="loginPage">
  <div class="login-card">
    <div style="width:64px;height:64px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:1.8rem;color:#fff;">
      <i class="fas fa-shield-alt"></i>
    </div>
    <div class="login-logo">🛍️ A.T Shop</div>
    <div class="login-sub">Admin Panel — শুধুমাত্র অ্যাডমিনের জন্য</div>
    <div class="login-field">
      <label>ইমেইল</label>
      <input type="email" id="loginEmail" placeholder="admin@example.com" />
    </div>
    <div class="login-field">
      <label>পাসওয়ার্ড</label>
      <input type="password" id="loginPass" placeholder="••••••••" onkeydown="if(event.key==='Enter')doLogin()" />
    </div>
    <div class="login-field" style="display:flex;align-items:center;gap:8px;">
      <input type="checkbox" id="rememberMe" style="width:auto;margin:0;cursor:pointer;" />
      <label for="rememberMe" style="margin:0;cursor:pointer;color:#cbd5e1;">Remember Me (৩ দিন লগইন থাকুন)</label>
    </div>
    <button class="login-btn" onclick="doLogin()">
      <i class="fas fa-sign-in-alt" style="margin-right:8px;"></i>লগইন করুন
    </button>
    <div id="loginError"></div>
    <div style="margin-top:20px;color:#475569;font-size:0.78rem;line-height:1.6;">
      প্রথমবার ব্যবহার? Firebase Console → Authentication এ একটি Admin ইমেইল/পাসওয়ার্ড তৈরি করুন।
    </div>
  </div>
</div>

<!-- ===== ADMIN APP ===== -->
<div id="adminApp">
  <div class="admin-layout">

    <!-- SIDEBAR -->
    <aside class="sidebar" id="sidebar">
      <div class="sidebar-logo">
        <div class="sidebar-logo-text">🛍️ A.T Shop</div>
        <div class="sidebar-logo-sub">Admin Panel</div>
      </div>
      <nav class="sidebar-nav">

        <!-- ড্যাশবোর্ড -->
        <div class="nav-item active" onclick="showPage('dashboard', this)">
          <i class="fas fa-tachometer-alt"></i> ড্যাশবোর্ড
        </div>

        <!-- পণ্য পরিচালনা -->
        <div class="nav-group-header" onclick="toggleNavGroup('grpProducts', this)">
          <i class="fas fa-box-open group-icon"></i>
          পণ্য পরিচালনা
          <i class="fas fa-chevron-down group-arrow"></i>
        </div>
        <div class="nav-group-body" id="grpProducts">
          <div class="nav-item" onclick="showPage('products', this)">
            <i class="fas fa-box"></i> সব পণ্য
          </div>
          <div class="nav-item" onclick="openAddProductModal()">
            <i class="fas fa-plus-circle"></i> নতুন পণ্য যোগ করুন
          </div>
          <div class="nav-item" onclick="showPage('ordering', this)">
            <i class="fas fa-sort"></i> পণ্য ক্রম নির্ধারণ
          </div>
        </div>

        <!-- অর্ডার -->
        <div class="nav-group-header" onclick="toggleNavGroup('grpOrders', this)">
          <i class="fas fa-shopping-bag group-icon"></i>
          অর্ডার
          <i class="fas fa-chevron-down group-arrow"></i>
        </div>
        <div class="nav-group-body" id="grpOrders">
          <div class="nav-item" onclick="showPage('orders', this)">
            <i class="fas fa-shopping-bag"></i> সব অর্ডার
          </div>
        </div>

        <!-- রিসেলার ব্যবস্থাপনা -->
        <div class="nav-group-header" onclick="toggleNavGroup('grpResellers', this)">
          <i class="fas fa-users group-icon"></i>
          রিসেলার ব্যবস্থাপনা
          <i class="fas fa-chevron-down group-arrow"></i>
        </div>
        <div class="nav-group-body" id="grpResellers">
          <div class="nav-item" onclick="showPage('resellers', this)">
            <i class="fas fa-user-tie"></i> রিসেলার তালিকা
          </div>
          <div class="nav-item" onclick="showPage('verifications', this)">
            <i class="fas fa-shield-halved"></i> ভেরিফিকেশন অনুরোধ
          </div>
          <div class="nav-item" onclick="showPage('resellerorders', this)">
            <i class="fas fa-receipt"></i> রিসেলার অর্ডার
          </div>
          <div class="nav-item" onclick="showPage('payoutrequests', this)">
            <i class="fas fa-money-check-alt"></i> উইথড্রয়াল রিকুয়েস্ট
            <span id="payoutPendingBadge" style="display:none;margin-left:auto;background:var(--danger);color:#fff;font-size:0.68rem;font-weight:700;padding:2px 7px;border-radius:50px;"></span>
          </div>
          <div class="nav-item" onclick="showPage('referralbonuses', this)">
            <i class="fas fa-gift"></i> রেফারেল বোনাস
            <span id="referralBonusBadge" style="display:none;margin-left:auto;background:var(--danger);color:#fff;font-size:0.68rem;font-weight:700;padding:2px 7px;border-radius:50px;"></span>
          </div>
          <div class="nav-item" onclick="showPage('notifications', this)">
            <i class="fas fa-bell"></i> নোটিফিকেশন
          </div>
          <div class="nav-item" onclick="showPage('resellerhelpcenter', this)">
            <i class="fas fa-headset"></i> রিসেলার হেল্প সেন্টার
          </div>
          <div class="nav-item" onclick="showPage('resellerlegal', this)">
            <i class="fas fa-file-contract"></i> রিসেলার শর্তাবলী ও গোপনীয়তা
          </div>
        </div>

        <!-- কন্টেন্ট পরিচালনা -->
        <div class="nav-group-header" onclick="toggleNavGroup('grpContent', this)">
          <i class="fas fa-layer-group group-icon"></i>
          কন্টেন্ট পরিচালনা
          <i class="fas fa-chevron-down group-arrow"></i>
        </div>
        <div class="nav-group-body" id="grpContent">
          <div class="nav-item" onclick="showPage('banners', this)">
            <i class="fas fa-images"></i> ব্যানার স্লাইডার
          </div>
          <div class="nav-item" onclick="showPage('marquee', this)">
            <i class="fas fa-scroll"></i> মার্কি টেক্সট
          </div>
          <div class="nav-item" onclick="showPage('whychoose', this)">
            <i class="fas fa-star"></i> কেন আমাদের
          </div>
          <div class="nav-item" onclick="showPage('reviews', this)">
            <i class="fas fa-comments"></i> গ্রাহকদের রিভিউ
          </div>
          <div class="nav-item" onclick="showPage('subscribers', this)">
            <i class="fas fa-envelope-open-text"></i> সাবস্ক্রাইবার
          </div>
          <div class="nav-item" onclick="showPage('quicklinks', this)">
            <i class="fas fa-link"></i> কুইক লিংক
          </div>
          <div class="nav-item" onclick="showPage('categories', this)">
            <i class="fas fa-list"></i> ক্যাটাগরি
          </div>
          <div class="nav-item" onclick="showPage('contactinfo', this)">
            <i class="fas fa-address-card"></i> যোগাযোগ তথ্য
          </div>
          <div class="nav-item" onclick="showPage('aboutus', this)">
            <i class="fas fa-info-circle"></i> আমাদের সম্পর্কে
          </div>
          <div class="nav-item" onclick="showPage('legalpages', this)">
            <i class="fas fa-file-contract"></i> পলিসি ও শর্তাবলী
          </div>
          <div class="nav-item" onclick="window.open('index.html','_blank')">
            <i class="fas fa-store"></i> শপ দেখুন
          </div>
        </div>

        <!-- সেটিংস — লগআউটের আগে সরাসরি -->
        <div class="nav-item" onclick="showPage('settings', this)" style="margin-top:8px;border-top:1px solid rgba(255,255,255,0.07);">
          <i class="fas fa-cog"></i> সেটিংস
        </div>

      </nav>
      <div class="sidebar-footer">
        <div class="logout-btn" onclick="doLogout()">
          <i class="fas fa-sign-out-alt"></i> লগআউট
        </div>
      </div>
    </aside>
    <div class="sidebar-backdrop" id="sidebarBackdrop" onclick="toggleSidebar()"></div>

    <!-- MAIN CONTENT -->
    <div class="main-content">
      <div class="top-bar">
        <div style="display:flex;align-items:center;gap:12px;">
          <button onclick="toggleSidebar()" style="display:none;background:#f1f5f9;border:none;width:36px;height:36px;border-radius:8px;cursor:pointer;font-size:1rem;" id="sidebarToggle">
            <i class="fas fa-bars"></i>
          </button>
          <div class="top-bar-title" id="topBarTitle">ড্যাশবোর্ড</div>
        </div>
        <div class="top-bar-right" style="display:flex;align-items:center;gap:8px;">
          <div class="admin-badge"><i class="fas fa-user-shield" style="margin-right:6px;"></i><span id="adminEmail">Admin</span></div>
          <button onclick="doLogout()" title="লগআউট" style="background:#fee2e2;border:none;border-radius:8px;width:36px;height:36px;cursor:pointer;color:#dc2626;font-size:1rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;">
            <i class="fas fa-sign-out-alt"></i>
          </button>
        </div>
      </div>

      <div class="page-content">

        <!-- ===== DASHBOARD PAGE ===== -->
        <div class="admin-page active" id="page-dashboard">
          <div class="stats-grid" id="dashboardStats">
            <div class="stat-card">
              <div class="stat-icon purple"><i class="fas fa-box"></i></div>
              <div><div class="stat-num" id="statProducts">—</div><div class="stat-label">মোট পণ্য</div></div>
            </div>
            <div class="stat-card">
              <div class="stat-icon green"><i class="fas fa-shopping-bag"></i></div>
              <div><div class="stat-num" id="statOrders">—</div><div class="stat-label">মোট অর্ডার</div></div>
            </div>
            <div class="stat-card">
              <div class="stat-icon orange"><i class="fas fa-clock"></i></div>
              <div><div class="stat-num" id="statPending">—</div><div class="stat-label">পেন্ডিং অর্ডার</div></div>
            </div>
            <div class="stat-card">
              <div class="stat-icon red"><i class="fas fa-fire"></i></div>
              <div><div class="stat-num" id="statHot">—</div><div class="stat-label">হট প্রোডাক্ট</div></div>
            </div>
          </div>
          <div class="section-card">
            <div class="section-header"><h3>সাম্প্রতিক অর্ডারসমূহ</h3><button class="btn btn-outline btn-sm" onclick="showPage('orders')"><i class="fas fa-eye"></i> সব দেখুন</button></div>
            <div class="section-body"><div id="recentOrdersTable"><div class="loading-wrap"><div class="spinner"></div><p style="margin-top:12px;color:#94a3b8;font-size:0.85rem;">লোড হচ্ছে...</p></div></div></div>
          </div>
        </div>

        <!-- ===== PRODUCTS PAGE ===== -->
        <div class="admin-page" id="page-products">
          <div class="section-card">
            <div class="section-header">
              <h3>পণ্য তালিকা (<span id="productListCount">0</span>টি)</h3>
              <div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;">
                <div class="search-box">
                  <i class="fas fa-search"></i>
                  <input class="form-control search-box" type="text" placeholder="পণ্য খুঁজুন..." id="productSearch" style="padding-left:36px;" />
                </div>
                <select class="form-control" style="width:auto;" id="productCatFilter" onchange="filterProductTable()">
                  <option value="">সব ক্যাটাগরি</option>
                  <option value="smartphone">স্মার্টফোন</option>
                  <option value="earphone">ইয়ারফোন</option>
                  <option value="smartwatch">স্মার্টওয়াচ</option>
                  <option value="laptop">ল্যাপটপ</option>
                  <option value="gaming">গেমিং</option>
                  <option value="camera">ক্যামেরা</option>
                  <option value="charger">চার্জার</option>
                  <option value="onyo">অনন্য</option>
                  <option value="other">অন্যান্য</option>
                </select>
                <button class="btn btn-primary" onclick="openAddProductModal()">
                  <i class="fas fa-plus"></i> নতুন পণ্য
                </button>
              </div>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="productTable">
                <thead>
                  <tr>
                    <th>ছবি</th>
                    <th>পণ্যের নাম</th>
                    <th>ক্যাটাগরি</th>
                    <th>মূল্য</th>
                    <th>স্টক</th>
                    <th>স্ট্যাটাস</th>
                    <th>ফিচার্ড</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="productTableBody">
                  <tr><td colspan="8" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
            <div style="padding:16px 24px;" id="productPagination"></div>
          </div>
        </div>

        <!-- ===== ORDERS PAGE ===== -->
        <div class="admin-page" id="page-orders">
          <div class="section-card">
            <div class="section-header">
              <h3>অর্ডার তালিকা (<span id="orderListCount">0</span>টি)</h3>
              <div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;">
                <div class="search-box">
                  <i class="fas fa-search"></i>
                  <input class="form-control" type="text" placeholder="আইডি, গ্রাহকের নাম, ফোন, পণ্য, ঠিকানা..." id="orderSearch" style="padding-left:36px;" oninput="filterOrderTable()" />
                </div>
                <select class="form-control" style="width:auto;" id="orderStatusFilter" onchange="filterOrderTable()">
                  <option value="">সব স্ট্যাটাস</option>
                  <option value="pending">পেন্ডিং</option>
                  <option value="confirmed">কনফার্মড</option>
                  <option value="shipped">শিপড</option>
                  <option value="delivered">ডেলিভারড</option>
                  <option value="cancelled">বাতিল</option>
                </select>
              </div>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="orderTable">
                <thead>
                  <tr>
                    <th>অর্ডার আইডি</th>
                    <th>গ্রাহক</th>
                    <th>পণ্য</th>
                    <th>মোট</th>
                    <th>পেমেন্ট</th>
                    <th>স্ট্যাটাস</th>
                    <th>তারিখ</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="orderTableBody">
                  <tr><td colspan="8" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>

        <!-- ===== RESELLERS PAGE ===== -->
        <div class="admin-page" id="page-resellers">
          <div class="section-card">
            <div class="section-header">
              <h3>রিসেলার তালিকা (<span id="resellerListCount">0</span>টি)</h3>
              <div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;">
                <div class="search-box">
                  <i class="fas fa-search"></i>
                  <input class="form-control" type="text" placeholder="নাম, ইমেইল বা রিসেলার ID খুঁজুন..." id="resellerSearch" style="padding-left:36px;" />
                </div>
                <select class="form-control" style="width:auto;" id="resellerStatusFilter" onchange="filterResellerTable()">
                  <option value="">সব স্ট্যাটাস</option>
                  <option value="pending">পেন্ডিং</option>
                  <option value="approved">অ্যাপ্রুভড</option>
                  <option value="rejected">রিজেক্টেড</option>
                </select>
                <button class="btn btn-primary" onclick="openAddResellerModal()">
                  <i class="fas fa-user-plus"></i> নতুন রিসেলার যোগ করুন
                </button>
              </div>
            </div>
            <div style="padding:14px 24px 0;color:#64748b;font-size:0.82rem;display:flex;align-items:center;gap:8px;">
              <i class="fas fa-info-circle" style="color:var(--primary);"></i>
              <span>ডেভেলপমেন্ট মোড: ড্যাশবোর্ড লক করা নেই। শুধু ভিজ্যুয়াল স্ট্যাটাস ব্যাজ দেখানো হচ্ছে।</span>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="resellerTable">
                <thead>
                  <tr>
                    <th>নাম</th>
                    <th>মোবাইল</th>
                    <th>ইমেইল</th>
                    <th>রিসেলার ID</th>
                    <th>স্ট্যাটাস</th>
                    <th>আবেদনের তারিখ</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="resellerTableBody">
                  <tr><td colspan="7" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>

        <!-- ===== VERIFICATIONS PAGE ===== -->
        <div class="admin-page" id="page-verifications">
          <div class="section-card">
            <div class="section-header">
              <h3>ভেরিফিকেশন অনুরোধ (<span id="verifyListCount">0</span>টি)</h3>
              <div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;">
                <div class="search-box">
                  <i class="fas fa-search"></i>
                  <input class="form-control" type="text" placeholder="রিসেলার ID খুঁজুন..." id="verifySearch" style="padding-left:36px;" oninput="filterVerifyTable()" />
                </div>
                <select class="form-control" style="width:auto;" id="verifyStatusFilter" onchange="filterVerifyTable()">
                  <option value="">সব স্ট্যাটাস</option>
                  <option value="pending">পেন্ডিং</option>
                  <option value="approved">অ্যাপ্রুভড</option>
                  <option value="rejected">রিজেক্টেড</option>
                </select>
              </div>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="verifyTable">
                <thead>
                  <tr>
                    <th>রিসেলার ID</th>
                    <th>ডকুমেন্ট টাইপ</th>
                    <th>ডকুমেন্ট ছবি</th>
                    <th>স্ট্যাটাস</th>
                    <th>সাবমিটের তারিখ</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="verifyTableBody">
                  <tr><td colspan="6" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>

        <!-- ===== RESELLER ORDERS PAGE ===== -->
        <div class="admin-page" id="page-resellerorders">
          <div class="section-card">
            <div class="section-header">
              <h3>রিসেলার অর্ডার তালিকা (<span id="resellerOrderListCount">0</span>টি)</h3>
              <div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;">
                <div class="search-box">
                  <i class="fas fa-search"></i>
                  <input class="form-control" type="text" placeholder="আইডি, রিসেলার নাম, গ্রাহক, ফোন, পণ্য, অর্ডার নম্বর..." id="roSearch" style="padding-left:36px;" oninput="filterResellerOrderTable()" />
                </div>
                <select class="form-control" style="width:auto;" id="roStatusFilter" onchange="filterResellerOrderTable()">
                  <option value="">সব স্ট্যাটাস</option>
                  <option value="pending">পেন্ডিং</option>
                  <option value="confirmed">কনফার্মড</option>
                  <option value="processing">প্রসেসিং</option>
                  <option value="shipped">শিপড</option>
                  <option value="delivered">ডেলিভারড</option>
                  <option value="cancelled">বাতিল</option>
                </select>
                <select class="form-control" style="width:auto;" id="roResellerFilter" onchange="filterResellerOrderTable()">
                  <option value="">সব রিসেলার</option>
                </select>
              </div>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="resellerOrderTable">
                <thead>
                  <tr>
                    <th>অর্ডার আইডি</th>
                    <th>রিসেলার</th>
                    <th>পণ্য</th>
                    <th>পরিমাণ</th>
                    <th>মোট খরচ</th>
                    <th>মোট কমিশন</th>
                    <th>স্ট্যাটাস</th>
                    <th>কমিশন স্ট্যাটাস</th>
                    <th>সোর্স</th>
                    <th>পেমেন্ট</th>
                    <th>গ্রাহক</th>
                    <th>তারিখ</th>
                  </tr>
                </thead>
                <tbody id="resellerOrderTableBody">
                  <tr><td colspan="12" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>

        <!-- ===== রিসেলার ওয়ালেট PAGE ===== -->
        <!-- ===== উইথড্রয়াল রিকুয়েস্ট PAGE ===== -->
        <div class="admin-page" id="page-payoutrequests">
          <div class="section-card">
            <div class="section-header">
              <h3>পেন্ডিং উইথড্রয়াল রিকুয়েস্ট (<span id="payoutListCount">0</span>টি)</h3>
              <button class="btn btn-outline btn-sm" onclick="listenPayoutRequests()">
                <i class="fas fa-rotate"></i> রিফ্রেশ
              </button>
            </div>
            <div id="payoutIndexWarning" style="display:none;margin:14px 24px 0;padding:14px 16px;background:#fef3c7;border:1px solid #fcd34d;border-radius:10px;color:#92400e;font-size:0.85rem;line-height:1.7;"></div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="payoutTable">
                <thead>
                  <tr>
                    <th>রিসেলার</th>
                    <th>পেমেন্ট মেথড</th>
                    <th>পেআউট নাম্বার</th>
                    <th>পরিমাণ</th>
                    <th>ব্যালেন্স (পরে)</th>
                    <th>অনুরোধের তারিখ</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="payoutTableBody">
                  <tr><td colspan="7" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
          </div>

          <!-- ইতিহাস -->
          <div class="section-card" style="margin-top:20px;">
            <div class="section-header">
              <h3><i class="fas fa-clock-rotate-left" style="margin-right:8px;color:#64748b;"></i>উইথড্রয়াল ইতিহাস (<span id="payoutHistoryCount">0</span>টি)</h3>
              <button class="btn btn-outline btn-sm" onclick="loadPayoutHistory()">
                <i class="fas fa-rotate"></i> রিফ্রেশ
              </button>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="payoutHistoryTable">
                <thead>
                  <tr>
                    <th>রিসেলার</th>
                    <th>পেমেন্ট মেথড</th>
                    <th>পেআউট নাম্বার</th>
                    <th>পরিমাণ</th>
                    <th>স্ট্যাটাস</th>
                    <th>প্রসেস তারিখ</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="payoutHistoryBody">
                  <tr><td colspan="7" style="text-align:center;padding:30px;color:#94a3b8;">লোড হচ্ছে...</td></tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>

        <!-- ===== রেফারেল বোনাস PAGE ===== -->
        <div class="admin-page" id="page-referralbonuses">
          <div class="section-card">
            <div class="section-header">
              <h3><i class="fas fa-gift" style="margin-right:8px;color:var(--primary);"></i>পেন্ডিং রেফারেল বোনাস (<span id="referralBonusCount">0</span>টি)</h3>
              <button class="btn btn-outline btn-sm" onclick="listenReferralBonusQueue()">
                <i class="fas fa-rotate"></i> রিফ্রেশ
              </button>
            </div>
            <div style="padding:14px 24px 0;color:#64748b;font-size:0.85rem;line-height:1.7;">
              <p>যখন কোনো রিসেলারের রেফার করা ব্যক্তির <strong>প্রথম অর্ডার Delivered</strong> হয়, নিচে একটি রিকুয়েস্ট আসে।
              <strong>Approve</strong> করলে রেফারকারী এবং রেফারড উভয়ের ওয়ালেটে <strong>৳৫০</strong> করে যোগ হবে।</p>
            </div>
            <div style="overflow-x:auto;margin-top:8px;">
              <table class="product-table" id="referralBonusTable">
                <thead>
                  <tr>
                    <th>রেফারকারী</th>
                    <th>রেফারড সদস্য</th>
                    <th>বোনাস</th>
                    <th>তারিখ</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="referralBonusTableBody">
                  <tr><td colspan="5" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
          </div>

          <!-- Approved / Rejected history -->
          <div class="section-card" style="margin-top:20px;">
            <div class="section-header">
              <h3><i class="fas fa-clock-rotate-left" style="margin-right:8px;color:#64748b;"></i>সম্পন্ন রেফারেল বোনাস ইতিহাস</h3>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="referralBonusHistoryTable">
                <thead>
                  <tr>
                    <th>রেফারকারী</th>
                    <th>রেফারড সদস্য</th>
                    <th>বোনাস</th>
                    <th>স্ট্যাটাস</th>
                    <th>তারিখ</th>
                  </tr>
                </thead>
                <tbody id="referralBonusHistoryBody">
                  <tr><td colspan="5" style="text-align:center;padding:30px;color:#94a3b8;">লোড হচ্ছে...</td></tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>

        <!-- ===== নোটিফিকেশন PAGE ===== -->
        <div class="admin-page" id="page-notifications">
          <div class="section-card">
            <div class="section-header">
              <h3><i class="fas fa-paper-plane" style="margin-right:8px;color:var(--primary);"></i>নতুন নোটিফিকেশন পাঠান</h3>
            </div>
            <div class="section-body">
              <div class="form-grid">
                <div class="form-group">
                  <label class="form-label">প্রাপক <span>*</span></label>
                  <select class="form-control" id="notifRecipient">
                    <option value="__all__">📢 সবার জন্য ব্রডকাস্ট (সব রিসেলার)</option>
                  </select>
                </div>
                <div class="form-group">
                  <label class="form-label">ধরন <span>*</span></label>
                  <select class="form-control" id="notifType">
                    <option value="system">সিস্টেম (System)</option>
                    <option value="promo">প্রমো (Promo)</option>
                    <option value="order_status">অর্ডার স্ট্যাটাস (Order Status)</option>
                  </select>
                </div>
                <div class="form-group form-full">
                  <label class="form-label">শিরোনাম (Title) <span>*</span></label>
                  <input class="form-control" id="notifTitle" type="text" placeholder="যেমন: ঈদ অফার শুরু হয়েছে!" maxlength="120" />
                </div>
                <div class="form-group form-full">
                  <label class="form-label">বার্তা (Message) <span>*</span></label>
                  <textarea class="form-control" id="notifMessage" placeholder="নোটিফিকেশনের বিস্তারিত বার্তা লিখুন..." maxlength="1000"></textarea>
                </div>
              </div>
              <div style="margin-top:6px;">
                <button class="btn btn-primary" id="notifSendBtn" onclick="sendAdminNotification()">
                  <i class="fas fa-paper-plane"></i> পাঠান
                </button>
              </div>
            </div>
          </div>

          <div class="section-card">
            <div class="section-header">
              <h3>পাঠানো লগ (<span id="notifListCount">0</span>টি)</h3>
              <div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;">
                <select class="form-control" style="width:auto;" id="notifFilterRecipient" onchange="filterNotificationsTable()">
                  <option value="">সব প্রাপক</option>
                </select>
                <select class="form-control" style="width:auto;" id="notifFilterType" onchange="filterNotificationsTable()">
                  <option value="">সব ধরন</option>
                  <option value="system">সিস্টেম</option>
                  <option value="promo">প্রমো</option>
                  <option value="order_status">অর্ডার স্ট্যাটাস</option>
                  <option value="wallet_credit">ওয়ালেট ক্রেডিট</option>
                  <option value="wallet_adjustment">ওয়ালেট অ্যাডজাস্টমেন্ট</option>
                  <option value="withdrawal_update">উইথড্রয়াল আপডেট</option>
                </select>
              </div>
            </div>
            <div style="overflow-x:auto;">
              <table class="product-table" id="notifTable">
                <thead>
                  <tr>
                    <th>প্রাপক</th>
                    <th>ধরন</th>
                    <th>শিরোনাম</th>
                    <th>তারিখ</th>
                    <th>স্ট্যাটাস</th>
                    <th>কার্যক্রম</th>
                  </tr>
                </thead>
                <tbody id="notifTableBody">
                  <tr><td colspan="6" class="loading-wrap"><div class="spinner"></div></td></tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>

        <!-- ===== RESELLER HELP CENTER ===== -->
        <div class="admin-page" id="page-resellerhelpcenter">
          <div class="section-card">
            <div class="section-header">
              <h3><i class="fas fa-headset" style="margin-right:8px;color:var(--primary);"></i>রিসেলার হেল্প সেন্টার</h3>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">
                <i class="fas fa-info-circle" style="color:var(--primary);margin-right:6px;"></i>
                এখানে যা যা দিবেন, রিসেলার অ্যাপের প্রোফাইল &gt; সাপোর্ট ও অন্যান্য &gt; হেল্প সেন্টার পেজে এবং টপ-বারের হেল্প আইকনে ক্লিক করলে সেগুলোই দেখাবে। যে ফিল্ড খালি রাখবেন সেই অপশনটি অ্যাপে দেখাবে না।
              </p>
              <div class="form-grid">
                <div class="form-group">
                  <label class="form-label"><i class="fas fa-phone-volume" style="color:var(--warning);margin-right:6px;"></i>হটলাইন নাম্বার</label>
                  <input class="form-control" id="rhcHotline" type="text" placeholder="০১৭০০-০০০০০০" />
                </div>
                <div class="form-group">
                  <label class="form-label">হটলাইন সময়সূচি (ঐচ্ছিক)</label>
                  <input class="form-control" id="rhcHours" type="text" placeholder="সকাল ৯টা - রাত ৯টা" />
                </div>
                <div class="form-group">
                  <label class="form-label"><i class="fab fa-whatsapp" style="color:var(--success);margin-right:6px;"></i>WhatsApp নাম্বার</label>
                  <input class="form-control" id="rhcWhatsapp" type="text" placeholder="৮৮০১৭০০-০০০০০০" />
                </div>
                <div class="form-group">
                  <label class="form-label"><i class="fas fa-envelope" style="color:#2563eb;margin-right:6px;"></i>সাপোর্ট ইমেইল</label>
                  <input class="form-control" id="rhcEmail" type="email" placeholder="support@example.com" />
                </div>
                <div class="form-group">
                  <label class="form-label"><i class="fab fa-telegram" style="color:#0088cc;margin-right:6px;"></i>টেলিগ্রাম এডমিন ইউজারনেম</label>
                  <input class="form-control" id="rhcTelegram" type="text" placeholder="username (@ ছাড়া বা সহ, উভয়ই চলবে)" />
                </div>
                <div class="form-group form-full">
                  <label class="form-label"><i class="fab fa-facebook" style="color:#1877f2;margin-right:6px;"></i>ফেসবুক সাপোর্ট গ্রুপ লিংক</label>
                  <input class="form-control" id="rhcFacebook" type="text" placeholder="https://facebook.com/groups/yourgroup" />
                </div>
              </div>
              <div style="margin-top:18px;">
                <button class="btn btn-primary" onclick="saveResellerHelpCenter()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== RESELLER LEGAL PAGES (Terms & Privacy) ===== -->
        <div class="admin-page" id="page-resellerlegal">
          <div class="section-card">
            <div class="section-header">
              <h3><i class="fas fa-file-contract" style="margin-right:8px;color:var(--primary);"></i>রিসেলার শর্তাবলী ও গোপনীয়তা নীতি</h3>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">
                <i class="fas fa-info-circle" style="color:var(--primary);margin-right:6px;"></i>
                এখানে যা লিখবেন, রিসেলার অ্যাপের প্রোফাইল &gt; সাপোর্ট ও অন্যান্য &gt; "শর্তাবলী" ও "গোপনীয়তা নীতি" পেজে দেখাবে। এটি স্বতন্ত্র — মূল ওয়েবসাইটের (index.html) পলিসি ও শর্তাবলী থেকে আলাদা। একাধিক প্যারাগ্রাফের জন্য মাঝে একটি খালি লাইন রাখুন।
              </p>

              <div class="form-group">
                <label class="form-label"><i class="fas fa-file-contract" style="color:var(--primary);margin-right:6px;"></i>শর্তাবলী — টাইটেল</label>
                <input type="text" class="form-control" id="rlpTermsTitle" placeholder="শর্তাবলী" />
              </div>
              <div class="form-group">
                <label class="form-label">শর্তাবলী — কন্টেন্ট</label>
                <textarea class="form-control" id="rlpTermsContent" rows="10" placeholder="রিসেলারদের জন্য শর্তাবলী এখানে লিখুন..."></textarea>
              </div>
              <div style="margin-bottom:24px;">
                <button class="btn btn-primary" onclick="saveResellerLegalPage('terms')"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>

              <hr style="border:none;border-top:1px solid #e2e8f0;margin:24px 0;" />

              <div class="form-group">
                <label class="form-label"><i class="fas fa-shield-halved" style="color:var(--primary);margin-right:6px;"></i>গোপনীয়তা নীতি — টাইটেল</label>
                <input type="text" class="form-control" id="rlpPrivacyTitle" placeholder="গোপনীয়তা নীতি" />
              </div>
              <div class="form-group">
                <label class="form-label">গোপনীয়তা নীতি — কন্টেন্ট</label>
                <textarea class="form-control" id="rlpPrivacyContent" rows="10" placeholder="রিসেলারদের জন্য গোপনীয়তা নীতি এখানে লিখুন..."></textarea>
              </div>
              <div>
                <button class="btn btn-primary" onclick="saveResellerLegalPage('privacy')"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== SETTINGS PAGE ===== -->
        <div class="admin-page" id="page-settings">
          <div class="settings-section">
            <h4><i class="fas fa-store" style="margin-right:8px;color:var(--primary);"></i>শপ তথ্য</h4>
            <div class="form-grid">
              <div class="form-group">
                <label class="form-label">শপের নাম</label>
                <input type="text" class="form-control" id="settingShopName" value="A.T Shop" />
              </div>
              <div class="form-group">
                <label class="form-label">ফোন নম্বর</label>
                <input type="text" class="form-control" id="settingPhone" value="01945-731609" />
              </div>
              <div class="form-group">
                <label class="form-label">ইমেইল (হেডারে দেখাবে)</label>
                <input type="email" class="form-control" id="settingEmail" placeholder="support@atshop.com" />
              </div>
              <div class="form-group">
                <label class="form-label">bKash নম্বর</label>
                <input type="text" class="form-control" id="settingBkash" value="01945-731609" />
              </div>
              <div class="form-group">
                <label class="form-label">Nagad নম্বর</label>
                <input type="text" class="form-control" id="settingNagad" value="01945-731609" />
              </div>
              <div class="form-group form-full">
                <label class="form-label">হেডার নোটিশ টেক্সট <span style="color:#64748b;font-weight:400;font-size:0.8rem;">(টপ-বারে ট্রাক আইকনের পাশে দেখাবে)</span></label>
                <input type="text" class="form-control" id="settingHeaderNotice" placeholder="সারা বাংলাদেশে ফ্রি ডেলিভারি ৳১৫০০+ অর্ডারে!" />
              </div>
              
              <div class="form-group form-full">
                <label class="form-label">শপ লোগো URL (1:1 বর্গাকৃতি) <span style="color:#64748b;font-weight:400;font-size:0.8rem;">(হেডার ও ফুটার — শপের নামের আগে দেখাবে)</span></label>
                <div style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;">
                  <input type="url" class="form-control" id="settingShopLogo" placeholder="https://i.ibb.co/xxx/logo.png" oninput="previewShopLogo(this.value)" style="flex:1;min-width:240px;" />
                  <button type="button" class="btn btn-outline btn-sm" onclick="uploadShopLogoToCloudinary()"><i class="fas fa-cloud-upload-alt"></i> Upload</button>
                </div>
                <img id="shopLogoPreview" src="" alt="Logo preview" style="display:none;margin-top:10px;width:60px;height:60px;object-fit:contain;border-radius:8px;border:1px solid #e2e8f0;background:#f8fafc;padding:4px;" onerror="this.style.display='none'" />
              </div>
              <!-- Logo Text: shows beside the logo image in the header -->
              <div class="form-group form-full">
                <label class="form-label">লোগো টেক্সট (শপের নাম) <span style="color:#64748b;font-weight:400;font-size:0.8rem;">(হেডারে লোগোর পাশে দেখাবে)</span></label>
                <input type="text" class="form-control" id="settingLogoText" placeholder="যেমন: A.T Shop" />
              </div>
            </div>
            <button class="btn btn-primary" onclick="saveShopSettings()"><i class="fas fa-save"></i> সেভ করুন</button>
          </div>

          <div class="settings-section">
            <h4><i class="fas fa-share-alt" style="margin-right:8px;color:var(--primary);"></i>সোশ্যাল মিডিয়া সেটিংস</h4>
            <div class="form-grid">
              <div class="form-group">
                <label class="form-label">Facebook URL</label>
                <input type="url" class="form-control" id="settingFacebookUrl" placeholder="https://facebook.com/yourpage" />
              </div>
              <div class="form-group">
                <label class="form-label">Instagram URL</label>
                <input type="url" class="form-control" id="settingInstagramUrl" placeholder="https://instagram.com/yourpage" />
              </div>
              <div class="form-group">
                <label class="form-label">YouTube URL</label>
                <input type="url" class="form-control" id="settingYoutubeUrl" placeholder="https://youtube.com/@yourchannel" />
              </div>
              <div class="form-group">
                <label class="form-label">WhatsApp URL <span style="color:#64748b;font-weight:400;font-size:0.8rem;">(ফুটারে দেখাবে)</span></label>
                <input type="url" class="form-control" id="settingWhatsappUrl" placeholder="https://wa.me/8801XXXXXXXXX" />
              </div>
              <div class="form-group">
                <label class="form-label">Telegram URL</label>
                <input type="url" class="form-control" id="settingTelegramUrl" placeholder="https://t.me/yourchannel" />
              </div>
              <div class="form-group form-full">
                <label class="form-label"><i class="fab fa-whatsapp" style="color:#25D366;margin-right:6px;"></i>WhatsApp Phone Number <span style="color:#64748b;font-weight:400;font-size:0.8rem;">(ফ্লোটিং বাটনের জন্য — শুধু নম্বর, যেমন: 8801XXXXXXXXX)</span></label>
                <input type="text" class="form-control" id="settingWhatsappPhone" placeholder="8801XXXXXXXXX" style="max-width:360px;" />
                <div style="margin-top:6px;font-size:0.8rem;color:#64748b;"><i class="fas fa-info-circle" style="margin-right:4px;color:var(--primary);"></i>এই নম্বরটি সাইটের ডানদিকের সবুজ WhatsApp বাটনে ব্যবহার হবে। দেশ কোড সহ লিখুন (যেমন: 8801712345678)।</div>
              </div>
            </div>
            <button class="btn btn-primary" onclick="saveSocialSettings()"><i class="fas fa-save"></i> সেভ করুন</button>
          </div>

          <div class="settings-section">
            <h4><i class="fas fa-key" style="margin-right:8px;color:var(--primary);"></i>Cloudinary Image Upload Config</h4>
            <p style="color:#64748b;font-size:0.85rem;margin-bottom:16px;">Cloudinary-তে বিনামূল্যে account খুলুন: <a href="https://cloudinary.com" target="_blank" style="color:var(--primary);">cloudinary.com</a></p>
            <div class="form-grid">
              <div class="form-group">
                <label class="form-label">Cloud Name</label>
                <input type="text" class="form-control" id="settingCloudName" placeholder="your-cloud-name" />
              </div>
              <div class="form-group">
                <label class="form-label">Upload Preset (unsigned)</label>
                <input type="text" class="form-control" id="settingUploadPreset" placeholder="your-upload-preset" />
              </div>
            </div>
            <button class="btn btn-primary" onclick="saveCloudinarySettings()"><i class="fas fa-save"></i> সেভ করুন</button>
          </div>

          <div class="settings-section">
            <h4><i class="fas fa-database" style="margin-right:8px;color:var(--primary);"></i>Firestore Rules (কপি করুন)</h4>
            <pre style="background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px;font-size:0.78rem;overflow-x:auto;line-height:1.6;color:#374151;">rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    // Products: Public read, Admin write only
    match /products/{productId} {
      allow read: if true;
      allow write: if request.auth != null;
    }
    // Orders: Anyone can create, Admin can read/update
    match /orders/{orderId} {
      allow create: if true;
      allow read, update: if request.auth != null;
    }
    // Settings: Public read, Admin write
    match /settings/{settingId} {
      allow read: if true;
      allow write: if request.auth != null;
    }
  }
}</pre>
            <p style="color:#64748b;font-size:0.82rem;margin-top:10px;">Firebase Console → Firestore → Rules এ paste করুন এবং Publish করুন।</p>

            <h4 style="margin-top:22px;"><i class="fas fa-wallet" style="margin-right:8px;color:var(--primary);"></i>resellerWallets / transactions Rules (রেফারেন্স)</h4>
            <p style="color:#64748b;font-size:0.82rem;margin-bottom:10px;">এই কালেকশনগুলোর সম্পূর্ণ নিরাপত্তা নিয়ম আগের ধাপে Firebase Console-এ যোগ করা হয়েছে। নিচেরটি শুধু রেফারেন্সের জন্য — মূল মূলনীতি হলো: রিসেলার নিজের ওয়ালেট/লেজার শুধু পড়তে পারবে, balance ফিল্ড কখনো ক্লায়েন্ট থেকে সরাসরি লিখতে পারবে না (শুধু সার্ভার-সাইড/অ্যাডমিন batch write এর মাধ্যমে বদলায়), আর ওয়ালেট status === 'suspended' হলে রিসেলার নতুন withdrawal (type:'debit', withdrawalStatus:'pending') ট্রানজ্যাকশন তৈরি করতে পারবে না।</p>
            <pre style="background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px;font-size:0.76rem;overflow-x:auto;line-height:1.6;color:#374151;">match /resellerWallets/{resellerId} {
  allow read: if request.auth != null &&
    (request.auth.uid == resellerId || isAdmin());
  // balance/totalEarned/totalWithdrawn কখনো client থেকে সরাসরি লেখা যাবে না
  allow write: if request.auth != null && isAdmin();

  match /transactions/{txnId} {
    allow read: if request.auth != null &&
      (request.auth.uid == resellerId || isAdmin());

    // রিসেলার শুধু নিজের জন্য একটি নতুন withdrawal request তৈরি করতে পারবে,
    // wallet suspended না থাকলে এবং balanceAfter বদলাতে না পারলে
    allow create: if request.auth != null &&
      request.auth.uid == resellerId &&
      get(/databases/$(database)/documents/resellerWallets/$(resellerId)).data.status != 'suspended' &&
      request.resource.data.type == 'debit' &&
      request.resource.data.withdrawalStatus == 'pending';

    // approve/reject/credit/adjustment — শুধু admin
    allow update, delete: if request.auth != null && isAdmin();
  }
}</pre>
          </div>
        </div>

        <!-- ===== BANNER SLIDER EDITOR ===== -->
        <div class="admin-page" id="page-banners">
          <div class="section-card">
            <div class="section-header">
              <h3><i class="fas fa-images" style="color:var(--primary);margin-right:8px;"></i>ব্যানার স্লাইডার</h3>
              <div style="display:flex;gap:8px;flex-wrap:wrap;">
                <button class="btn btn-success" onclick="addBannerItem()"><i class="fas fa-plus"></i> নতুন ব্যানার</button>
                <button class="btn btn-primary" onclick="saveBanners()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">
                <i class="fas fa-info-circle" style="color:var(--primary);margin-right:6px;"></i>
                হোমপেজের হিরো অংশে এই ব্যানারগুলো স্লাইড হয়ে দেখাবে। Desktop ও Mobile-এর জন্য আলাদা ছবি দিন।
                ক্রম নম্বর কমালে ব্যানার আগে দেখাবে। বন্ধ টগল করলে ঐ ব্যানার শপে দেখাবে না।
              </p>

              <div class="form-grid" style="margin-bottom:18px;">
                <div class="form-group">
                  <label class="form-label">স্লাইড স্পিড (মিলিসেকেন্ড)</label>
                  <input class="form-control" type="number" id="bannerSpeed" min="1500" step="500" placeholder="5000" />
                  <small style="color:#94a3b8;font-size:0.78rem;">প্রতি ব্যানার কতক্ষণ দেখাবে। সর্বনিম্ন 1500 (1.5 সেকেন্ড)।</small>
                </div>
              </div>

              <div id="bannersList" style="display:flex;flex-direction:column;gap:14px;"></div>

              <div style="margin-top:18px;display:flex;gap:8px;flex-wrap:wrap;">
                <button class="btn btn-success" onclick="addBannerItem()"><i class="fas fa-plus"></i> নতুন ব্যানার</button>
                <button class="btn btn-primary" onclick="saveBanners()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
                <a class="btn btn-outline" href="index.html" target="_blank"><i class="fas fa-external-link-alt"></i> শপে দেখুন</a>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== MARQUEE EDITOR ===== -->
        <div class="admin-page" id="page-marquee">
          <div class="section-card">
            <div class="section-header">
              <h3>মার্কি টেক্সট (চলমান লেখা)</h3>
              <button class="btn btn-success" onclick="addMarqueeItem()"><i class="fas fa-plus"></i> নতুন লাইন</button>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">প্রতিটি লাইন আলাদা করে এডিট/মুছে ফেলা যাবে। নিচের "সংরক্ষণ করুন" বাটনে ক্লিক করলে সব পরিবর্তন শপে দেখা যাবে।</p>
              <div id="marqueeList" style="display:flex;flex-direction:column;gap:10px;"></div>
              <div style="margin-top:18px;">
                <button class="btn btn-primary" onclick="saveMarquee()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== WHY CHOOSE US EDITOR ===== -->
        <div class="admin-page" id="page-whychoose">
          <div class="section-card">
            <div class="section-header">
              <h3>"কেন আমাদের বেছে নেবেন?" সেকশন</h3>
              <button class="btn btn-success" onclick="addWhyChooseItem()"><i class="fas fa-plus"></i> নতুন আইটেম</button>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">প্রতিটি ফিচার কার্ড এডিট করুন। আইকনের জন্য Font Awesome ক্লাস ব্যবহার করুন (যেমন: <code>fas fa-shield-alt</code>)।</p>
              <div id="whyChooseList" style="display:flex;flex-direction:column;gap:12px;"></div>
              <div style="margin-top:18px;">
                <button class="btn btn-primary" onclick="saveWhyChoose()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== REVIEWS MANAGER ===== -->
        <div class="admin-page" id="page-reviews">
          <div class="section-card">
            <div class="section-header">
              <h3>হোমপেজ রিভিউ</h3>
              <button class="btn btn-success" onclick="openReviewModal()"><i class="fas fa-plus"></i> নতুন রিভিউ</button>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">হোমপেজ থেকে জমা হওয়া রিভিউ এবং ম্যানুয়ালি যোগ করা রিভিউ এখানে দেখা ও ডিলিট করা যাবে।</p>
              <div id="reviewsList"></div>
            </div>
          </div>

          <!-- গ্রাহকদের রিভিউ — user-submitted product reviews -->
          <div class="section-card" style="margin-top:24px;">
            <div class="section-header">
              <h3><i class="fas fa-comments" style="color:var(--primary);margin-right:8px;"></i>গ্রাহকদের রিভিউ</h3>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:18px;">
                ব্যবহারকারীরা পণ্যের পেজ থেকে যে রিভিউ জমা দিয়েছেন সেগুলো এখানে দেখা যাবে। আপনি রিভিউ মুছতে এবং ম্যানুয়াল রিভিউ যোগ করতে পারবেন।
              </p>

              <!-- Manual add form -->
              <div style="background:#f0fdf4; border:1px solid #bbf7d0; border-radius:10px; padding:16px; margin-bottom:20px;">
                <div style="font-weight:700; color:#065f46; margin-bottom:12px; font-size:0.95rem;">
                  <i class="fas fa-plus-circle" style="color:#10b981; margin-right:6px;"></i>ম্যানুয়াল কাস্টম রিভিউ যোগ করুন
                </div>
                <div style="display:grid; grid-template-columns:1fr 1fr; gap:8px;">
                  <select id="adminReviewProductAdmin" style="padding:8px 10px; border:1px solid #d1d5db; border-radius:6px; font-family:inherit; grid-column:1 / -1; font-size:0.9rem;"></select>
                  <input id="adminReviewNameAdmin" type="text" placeholder="নাম" style="padding:8px 10px; border:1px solid #d1d5db; border-radius:6px; font-family:inherit; font-size:0.9rem;" />
                  <input id="adminReviewLocAdmin" type="text" placeholder="এলাকা" style="padding:8px 10px; border:1px solid #d1d5db; border-radius:6px; font-family:inherit; font-size:0.9rem;" />
                  <textarea id="adminReviewTextAdmin" placeholder="রিভিউ টেক্সট" rows="2" style="padding:8px 10px; border:1px solid #d1d5db; border-radius:6px; font-family:inherit; grid-column:1 / -1; font-size:0.9rem; resize:vertical;"></textarea>
                  <select id="adminReviewRatingAdmin" style="padding:8px 10px; border:1px solid #d1d5db; border-radius:6px; font-family:inherit; font-size:0.9rem;">
                    <option value="5">⭐⭐⭐⭐⭐ (5)</option>
                    <option value="4">⭐⭐⭐⭐ (4)</option>
                    <option value="3">⭐⭐⭐ (3)</option>
                    <option value="2">⭐⭐ (2)</option>
                    <option value="1">⭐ (1)</option>
                  </select>
                  <button onclick="adminAddManualReviewPanel()" style="background:#10b981; color:#fff; border:none; border-radius:6px; padding:8px 14px; font-weight:600; cursor:pointer; font-family:inherit; font-size:0.9rem;">
                    <i class="fas fa-plus" style="margin-right:6px;"></i>যোগ করুন
                  </button>
                </div>
                <div id="adminReviewMsgPanel" style="margin-top:8px; font-size:0.85rem;"></div>
              </div>

              <!-- Per-product review lists -->
              <div style="font-weight:600; color:#1f2937; margin-bottom:10px; font-size:0.95rem;">
                <i class="fas fa-list" style="color:var(--primary); margin-right:6px;"></i>পণ্য অনুসারে জমা হওয়া রিভিউ
              </div>
              <div id="adminProductReviewsListPanel">
                <p style="color:#94a3b8;">লোড হচ্ছে...</p>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== SUBSCRIBERS LIST ===== -->
        <div class="admin-page" id="page-subscribers">
          <div class="section-card">
            <div class="section-header">
              <h3>সাবস্ক্রাইবার তালিকা (<span id="subscribersCount">0</span>)</h3>
              <div style="display:flex;gap:8px;">
                <button class="btn btn-outline btn-sm" onclick="copyAllSubscribers()"><i class="fas fa-copy"></i> সব ইমেইল কপি</button>
                <button class="btn btn-outline btn-sm" onclick="exportSubscribersCSV()"><i class="fas fa-file-csv"></i> CSV ডাউনলোড</button>
              </div>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">এই তালিকা থেকে ইমেইল কপি করে আপনি ম্যানুয়ালি নতুন পণ্য বা অফারের নোটিফিকেশন পাঠাতে পারবেন।</p>
              <div id="subscribersTable"></div>
            </div>
          </div>
        </div>

        <!-- ===== QUICK LINKS EDITOR ===== -->
        <div class="admin-page" id="page-quicklinks">
          <div class="section-card">
            <div class="section-header">
              <h3>ফুটার কুইক লিংক</h3>
              <button class="btn btn-success" onclick="addQuickLink()"><i class="fas fa-plus"></i> নতুন লিংক</button>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">টাইপ বাছাই করুন: হোম, শপ, অফার, নতুন পণ্য, আমাদের সম্পর্কে, যোগাযোগ, ক্যাটাগরি (টার্গেটে ক্যাটাগরি key দিন), পণ্য (টার্গেটে product ID দিন), অথবা URL (টার্গেটে পূর্ণ লিংক দিন)।</p>
              <div id="quickLinksList" style="display:flex;flex-direction:column;gap:12px;"></div>
              <div style="margin-top:18px;">
                <button class="btn btn-primary" onclick="saveQuickLinks()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== CATEGORIES MANAGER ===== -->
        <div class="admin-page" id="page-categories">
          <div class="section-card">
            <div class="section-header">
              <h3>ক্যাটাগরি ব্যবস্থাপনা</h3>
              <button class="btn btn-success" onclick="openCategoryModal()"><i class="fas fa-plus"></i> নতুন ক্যাটাগরি</button>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">এখানে যোগ করা ক্যাটাগরি পুরো ওয়েবসাইটে অ্যাপ্লাই হবে। পণ্য যোগ করার সময় <b>Key</b> (যেমন <code>smartphone</code>) ফিল্ডে এই নামটিই ব্যবহার করুন।</p>
              <div id="categoriesList"></div>
            </div>
          </div>
        </div>

        <!-- ===== CONTACT INFO EDITOR ===== -->
        <div class="admin-page" id="page-contactinfo">
          <div class="section-card">
            <div class="section-header"><h3>যোগাযোগ তথ্য</h3></div>
            <div class="section-body">
              <div class="form-grid">
                <div class="form-group form-full">
                  <label class="form-label">ঠিকানা</label>
                  <input class="form-control" id="ciAddress" type="text" placeholder="ঠিকানা" />
                </div>
                <div class="form-group">
                  <label class="form-label">ফোন ১</label>
                  <input class="form-control" id="ciPhone" type="text" placeholder="০১৭০০-০০০০০০" />
                </div>
                <div class="form-group">
                  <label class="form-label">ফোন ২ (ঐচ্ছিক)</label>
                  <input class="form-control" id="ciPhone2" type="text" placeholder="০১৮০০-০০০০০০" />
                </div>
                <div class="form-group">
                  <label class="form-label">ইমেইল ১</label>
                  <input class="form-control" id="ciEmail" type="email" placeholder="info@example.com" />
                </div>
                <div class="form-group">
                  <label class="form-label">ইমেইল ২ (ঐচ্ছিক)</label>
                  <input class="form-control" id="ciEmail2" type="email" placeholder="support@example.com" />
                </div>
                <div class="form-group form-full">
                  <label class="form-label">অফিস সময়</label>
                  <input class="form-control" id="ciHours" type="text" placeholder="শনি - বৃহস্পতি: সকাল ৯টা - রাত ৯টা" />
                </div>
              </div>
              <div style="margin-top:18px;">
                <button class="btn btn-primary" onclick="saveContactInfo()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
              </div>
            </div>
          </div>
        </div>

        <!-- ===== ABOUT US EDITOR ===== -->
        <div class="admin-page" id="page-aboutus">
          <div class="section-card">
            <div class="section-header"><h3>"আমাদের সম্পর্কে" পেজ</h3></div>
            <div class="section-body">
              <div class="form-group">
                <label class="form-label">পেজ টাইটেল</label>
                <input class="form-control" id="aboutPageTitle" type="text" placeholder="আমাদের সম্পর্কে" />
              </div>
              <div class="form-group" style="margin-top:14px;">
                <label class="form-label">কন্টেন্ট (একাধিক প্যারাগ্রাফের জন্য খালি লাইন রাখুন)</label>
                <textarea class="form-control" id="aboutPageContent" rows="14" placeholder="আমাদের প্রতিষ্ঠান সম্পর্কে লিখুন..."></textarea>
              </div>
              <div style="margin-top:18px;">
                <button class="btn btn-primary" onclick="saveAboutPage()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
                <a class="btn btn-outline" href="index.html#about" target="_blank"><i class="fas fa-external-link-alt"></i> পেজ দেখুন</a>
              </div>
            </div>
          </div>
        </div>

        
        <div class="admin-page" id="page-ordering">
          <div class="section-card">
            <div class="section-header">
              <h3>পণ্যের ক্রম পরিবর্তন</h3>
              <button class="btn btn-primary" onclick="saveProductOrdering()"><i class="fas fa-save"></i> ক্রম সংরক্ষণ করুন</button>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">
                <i class="fas fa-info-circle" style="color:var(--primary);margin-right:6px;"></i>
                প্রতিটি পণ্যের পাশে ক্রম নম্বর দিন। ছোট সংখ্যাযুক্ত পণ্য হোমপেজে আগে দেখাবে (1 = সবার আগে)। উপরের সংরক্ষণ বাটনে ক্লিক করতে ভুলবেন না।
              </p>
              <div id="orderingList" style="display:flex;flex-direction:column;gap:8px;">
                <p style="color:#94a3b8;">লোড হচ্ছে...</p>
              </div>
            </div>
          </div>
        </div>

        
        <div class="admin-page" id="page-legalpages">
          <div class="section-card">
            <div class="section-header">
              <h3>প্রাইভেসি পলিসি / রিটার্ন পলিসি / শর্তাবলী</h3>
            </div>
            <div class="section-body">
              <p style="color:#64748b;font-size:0.9rem;margin-bottom:14px;">
                <i class="fas fa-info-circle" style="color:var(--primary);margin-right:6px;"></i>
                নিচের প্রতিটি পলিসি এডিট করুন। সংরক্ষণের পর ফুটারে থাকা লিংকে ক্লিক করলে এগুলো আলাদা পেজে দেখাবে।
              </p>

              <div class="form-group">
                <label class="form-label"><i class="fas fa-shield-alt" style="color:var(--primary);margin-right:6px;"></i>প্রাইভেসি পলিসি — টাইটেল</label>
                <input type="text" class="form-control" id="legalPrivacyTitle" placeholder="প্রাইভেসি পলিসি" />
              </div>
              <div class="form-group">
                <label class="form-label">প্রাইভেসি পলিসি — কন্টেন্ট (একাধিক প্যারাগ্রাফের জন্য খালি লাইন রাখুন)</label>
                <textarea class="form-control" id="legalPrivacyContent" rows="8" placeholder="আপনার প্রাইভেসি পলিসি এখানে লিখুন..."></textarea>
              </div>
              <div style="margin-bottom:24px;">
                <button class="btn btn-primary" onclick="saveLegalPage('privacy')"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
                <a class="btn btn-outline" href="privacy.html" target="_blank"><i class="fas fa-external-link-alt"></i> পেজ দেখুন</a>
              </div>

              <hr style="border:none;border-top:1px solid #e2e8f0;margin:24px 0;" />

              <div class="form-group">
                <label class="form-label"><i class="fas fa-undo" style="color:var(--primary);margin-right:6px;"></i>রিটার্ন পলিসি — টাইটেল</label>
                <input type="text" class="form-control" id="legalReturnTitle" placeholder="রিটার্ন পলিসি" />
              </div>
              <div class="form-group">
                <label class="form-label">রিটার্ন পলিসি — কন্টেন্ট</label>
                <textarea class="form-control" id="legalReturnContent" rows="8" placeholder="আপনার রিটার্ন পলিসি এখানে লিখুন..."></textarea>
              </div>
              <div style="margin-bottom:24px;">
                <button class="btn btn-primary" onclick="saveLegalPage('return')"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
                <a class="btn btn-outline" href="return.html" target="_blank"><i class="fas fa-external-link-alt"></i> পেজ দেখুন</a>
              </div>

              <hr style="border:none;border-top:1px solid #e2e8f0;margin:24px 0;" />

              <div class="form-group">
                <label class="form-label"><i class="fas fa-file-contract" style="color:var(--primary);margin-right:6px;"></i>শর্তাবলী (Terms & Conditions) — টাইটেল</label>
                <input type="text" class="form-control" id="legalTermsTitle" placeholder="শর্তাবলী" />
              </div>
              <div class="form-group">
                <label class="form-label">শর্তাবলী — কন্টেন্ট</label>
                <textarea class="form-control" id="legalTermsContent" rows="8" placeholder="আপনার শর্তাবলী এখানে লিখুন..."></textarea>
              </div>
              <div>
                <button class="btn btn-primary" onclick="saveLegalPage('terms')"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
                <a class="btn btn-outline" href="terms.html" target="_blank"><i class="fas fa-external-link-alt"></i> পেজ দেখুন</a>
              </div>
            </div>
          </div>
        </div>

      </div><!-- /page-content -->
    </div><!-- /main-content -->
  </div><!-- /admin-layout -->
</div><!-- /adminApp -->

<!-- ===== ADD/EDIT PRODUCT MODAL ===== -->
<div class="modal-overlay" id="productModal">
  <div class="modal-box">
    <div class="modal-header">
      <h3 id="productModalTitle">নতুন পণ্য যোগ করুন</h3>
      <button class="modal-close" onclick="closeProductModal()"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <input type="hidden" id="editProductId" />

      <!-- Basic Info -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">📋 মূল তথ্য</div>
      <div class="form-grid">
        <div class="form-group form-full">
          <label class="form-label">পণ্যের নাম <span>*</span></label>
          <input type="text" class="form-control" id="pTitle" placeholder="পণ্যের সম্পূর্ণ নাম দিন" />
        </div>
        <div class="form-group">
          <label class="form-label">ক্যাটাগরি <span>*</span></label>
          <select class="form-control" id="pCategory">
            <option value="">— ক্যাটাগরি নির্বাচন করুন —</option>
          </select>
          <small style="display:block;margin-top:6px;color:#94a3b8;font-size:0.75rem;">
            ক্যাটাগরি যোগ/এডিট করতে সাইডবার থেকে "ক্যাটাগরি" পেজে যান।
          </small>
        </div>
        <div class="form-group">
          <label class="form-label">ব্র্যান্ড</label>
          <input type="text" class="form-control" id="pBrand" placeholder="Samsung, Apple, Xiaomi..." />
        </div>
        <div class="form-group form-full">
          <label class="form-label">রঙ</label>
          <input type="text" class="form-control" id="pColors" placeholder="Black, Blue, Red, Green" />
        </div>
      </div>

      <!-- Pricing -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">💰 মূল্য তথ্য</div>
      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">বর্তমান মূল্য (৳) <span>*</span></label>
          <input type="number" class="form-control" id="pPrice" placeholder="1299" min="0" />
        </div>
        <div class="form-group">
          <label class="form-label">আগের মূল্য (৳) <span title="ডিসকাউন্ট দেখাতে">?</span></label>
          <input type="number" class="form-control" id="pOldPrice" placeholder="1999" min="0" />
        </div>
        <div class="form-group">
          <label class="form-label">রিসেলার কমিশন (৳)</label>
          <input type="number" class="form-control" id="pResellerCommission" placeholder="450" min="0" />
        </div>
        <div class="form-group">
          <label class="form-label">স্টক পরিমাণ</label>
          <input type="number" class="form-control" id="pStock" placeholder="100" min="0" />
        </div>
      </div>

      <!-- Delivery -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">🚚 ডেলিভারি তথ্য</div>
      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">ভিতরের জোন নাম</label>
          <input type="text" class="form-control" id="pDeliveryInsideName" placeholder="যেমন: ঢাকার ভিতরে" />
        </div>
        <div class="form-group">
          <label class="form-label">ভিতরের জোন চার্জ (৳)</label>
          <input type="number" class="form-control" id="pDeliveryInside" placeholder="70" min="0" />
        </div>
        <div class="form-group">
          <label class="form-label">বাইরের জোন নাম</label>
          <input type="text" class="form-control" id="pDeliveryOutsideName" placeholder="যেমন: ঢাকার বাইরে" />
        </div>
        <div class="form-group">
          <label class="form-label">বাইরের জোন চার্জ (৳)</label>
          <input type="number" class="form-control" id="pDeliveryOutside" placeholder="130" min="0" />
        </div>
      </div>
      <div style="display:flex;gap:24px;flex-wrap:wrap;margin-bottom:16px;">
        <div class="toggle-group">
          <button type="button" class="toggle" id="toggleFreeDelivery" onclick="this.classList.toggle('on')"></button>
          <label>ফ্রি ডেলিভারি</label>
        </div>
        <div class="toggle-group">
          <button type="button" class="toggle" id="toggleFeatured" onclick="this.classList.toggle('on')"></button>
          <label>ফিচার্ড পণ্য</label>
        </div>
        <div class="toggle-group">
          <button type="button" class="toggle" id="toggleHot" onclick="this.classList.toggle('on')"></button>
          <label>হট পণ্য 🔥</label>
        </div>
        <div class="toggle-group">
          <button type="button" class="toggle" id="toggleSale" onclick="this.classList.toggle('on')"></button>
          <label>সেল পণ্য</label>
        </div>
        <div class="toggle-group" title="বন্ধ রাখলে এই পণ্যের অর্ডার পেজে ক্যাশ অন ডেলিভারির অগ্রিম চার্জ বক্স দেখাবে না।">
          <button type="button" class="toggle on" id="toggleCodAdvance" onclick="this.classList.toggle('on')"></button>
          <label>অগ্রিম ডেলিভারি চার্জ পেমেন্ট</label>
        </div>
      </div>

      <!-- Delivery info shown on product page (Reviews/Delivery tab) -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:10px;flex-wrap:wrap;">
        <span>🚚 প্রডাক্ট পেজের ডেলিভারি অপশন (রিভিউ পাশে)</span>
        <span class="toggle-group" style="margin-left:auto;">
          <button type="button" class="toggle on" id="toggleDeliveryInfo" onclick="this.classList.toggle('on')"></button>
          <label style="font-size:0.78rem;font-weight:600;color:#374151;">দেখান</label>
        </span>
      </div>
      <div style="font-size:0.78rem;color:#64748b;margin-bottom:10px;">
        <i class="fas fa-info-circle" style="color:var(--primary);margin-right:4px;"></i>
        তিনটি অপশনের নিচে আপনার নিজের লেখা বসবে। টগল বন্ধ রাখলে পুরো ডেলিভারি ট্যাব লুকানো থাকবে।
      </div>
      <div class="form-grid">
        <div class="form-group form-full">
          <label class="form-label">স্ট্যান্ডার্ড ডেলিভারি — বিবরণ</label>
          <textarea class="form-control" id="pDeliveryStandardText" rows="2" placeholder="যেমন: সারা বাংলাদেশে ৪৮-৭২ ঘণ্টার মধ্যে। ডেলিভারি চার্জ: ৳৭০-১২০"></textarea>
        </div>
        <div class="form-group form-full">
          <label class="form-label">এক্সপ্রেস ডেলিভারি — বিবরণ</label>
          <textarea class="form-control" id="pDeliveryExpressText" rows="2" placeholder="যেমন: ঢাকার মধ্যে ২৪ ঘণ্টায়। ডেলিভারি চার্জ: ৳৫০"></textarea>
        </div>
        <div class="form-group form-full">
          <label class="form-label">ফ্রি ডেলিভারি — বিবরণ</label>
          <textarea class="form-control" id="pDeliveryFreeText" rows="2" placeholder="যেমন: ৳১৫০০+ অর্ডারে সারা বাংলাদেশে ফ্রি ডেলিভারি"></textarea>
        </div>
      </div>

      <!-- Images -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">🖼️ ছবি</div>
      <div class="form-group">
        <label class="form-label">Thumbnail URL <span>*</span></label>
        <div style="display:flex;gap:8px;align-items:center;">
          <input type="url" class="form-control" id="pThumbnail" placeholder="https://..." oninput="previewThumb(this.value)" />
          <button type="button" class="img-upload-btn" onclick="uploadToCloudinary('thumbnail')">
            <i class="fas fa-cloud-upload-alt"></i> Upload
          </button>
        </div>
        <img id="thumbPreview" src="" style="display:none;" class="img-preview" onerror="this.style.display='none'" />
      </div>
      <div class="form-group">
        <label class="form-label">Gallery Images (একটি করে URL যোগ করুন)</label>
        <div style="display:flex;gap:8px;align-items:center;">
          <input type="url" class="form-control" id="pGalleryInput" placeholder="https://..." />
          <button type="button" class="img-upload-btn" onclick="uploadToCloudinary('gallery')">
            <i class="fas fa-cloud-upload-alt"></i> Upload
          </button>
          <button type="button" class="btn btn-success btn-sm" onclick="addGalleryImage()">
            <i class="fas fa-plus"></i> যোগ
          </button>
        </div>
        <div class="gallery-grid" id="galleryPreview"></div>
        <input type="hidden" id="pGallery" value="[]" />
      </div>
      <div class="form-group">
        <label class="form-label">ভিডিও URL (YouTube embed)</label>
        <input type="url" class="form-control" id="pVideoUrl" placeholder="https://www.youtube.com/embed/..." />
      </div>

      <!-- Description -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">📝 বিবরণ</div>
      <div class="form-group">
        <label class="form-label">সংক্ষিপ্ত বিবরণ <span>*</span></label>
        <textarea class="form-control" id="pDescription" rows="3" placeholder="পণ্যের সংক্ষিপ্ত বিবরণ..."></textarea>
      </div>
      <div class="form-group">
        <label class="form-label">সম্পূর্ণ বিবরণ</label>
        <textarea class="form-control" id="pFullDescription" rows="5" placeholder="পণ্যের সম্পূর্ণ বিবরণ, বৈশিষ্ট্য, ইত্যাদি..."></textarea>
      </div>

      <!-- Specifications -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">📊 স্পেসিফিকেশন</div>
      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">ডেলিভারির সময়</label>
          <input type="text" class="form-control" id="pDeliveryTime" placeholder="যেমন: ২৪-৭২ ঘণ্টা" />
        </div>
        <div class="form-group">
          <label class="form-label">রিটার্ন পলিসি</label>
          <input type="text" class="form-control" id="pReturnPolicy" placeholder="যেমন: ৭ দিন" />
        </div>
      </div>
      <div id="specRows"></div>
      <button type="button" class="btn btn-outline btn-sm" onclick="addSpecRow()" style="margin-bottom:16px;">
        <i class="fas fa-plus"></i> স্পেসিফিকেশন যোগ করুন
      </button>

      <!-- Custom Product Reviews -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">⭐ এই পণ্যের কাস্টম রিভিউ</div>
      <div style="font-size:0.78rem;color:#64748b;margin-bottom:10px;">
        <i class="fas fa-info-circle" style="color:var(--primary);margin-right:4px;"></i>
        এখানে যোগ করা রিভিউগুলি শুধু এই পণ্যের ডিটেইলস পেইজে দেখাবে।
      </div>
      <div id="productReviewRows" style="display:flex;flex-direction:column;gap:10px;margin-bottom:10px;"></div>
      <button type="button" class="btn btn-outline btn-sm" onclick="addProductReviewRow()" style="margin-bottom:16px;">
        <i class="fas fa-plus"></i> রিভিউ যোগ করুন
      </button>

      <!-- Status & Rating -->
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">⚙️ অন্যান্য</div>
      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">রেটিং (১-৫)</label>
          <input type="number" class="form-control" id="pRating" value="5" min="1" max="5" step="0.1" />
        </div>
        <div class="form-group">
          <label class="form-label">স্ট্যাটাস</label>
          <select class="form-control" id="pStatus">
            <option value="active">সক্রিয় (Active)</option>
            <option value="inactive">নিষ্ক্রিয় (Inactive)</option>
          </select>
        </div>
      </div>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="closeProductModal()">বাতিল</button>
      <button class="btn btn-primary" onclick="saveProduct()" id="saveProductBtn">
        <i class="fas fa-save"></i> পণ্য সেভ করুন
      </button>
    </div>
  </div>
</div>

<!-- ===== ORDER DETAIL MODAL ===== -->
<div class="modal-overlay" id="orderModal">
  <div class="modal-box" style="max-width:520px;">
    <div class="modal-header">
      <h3>অর্ডার বিবরণ <span id="orderModalIdLabel" style="font-size:0.8rem;font-family:monospace;font-weight:700;color:#6c63ff;background:#ede9fe;padding:2px 10px;border-radius:20px;margin-left:6px;"></span></h3>
      <button class="modal-close" onclick="closeOrderModal()"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body" id="orderModalBody"></div>
    <div class="modal-footer">
      <select class="form-control" style="width:auto;" id="orderStatusSelect">
        <option value="pending">পেন্ডিং</option>
        <option value="confirmed">কনফার্মড</option>
        <option value="shipped">শিপড</option>
        <option value="delivered">ডেলিভারড</option>
        <option value="cancelled">বাতিল</option>
      </select>
      <button class="btn btn-success" onclick="updateOrderStatus()"><i class="fas fa-check"></i> স্ট্যাটাস আপডেট</button>
    </div>
  </div>
</div>

<!-- ===== DELETE CONFIRM MODAL ===== -->
<div class="modal-overlay" id="deleteModal">
  <div class="modal-box" style="max-width:400px;">
    <div class="modal-header">
      <h3 style="color:var(--danger);">⚠️ পণ্য মুছে ফেলুন</h3>
      <button class="modal-close" onclick="document.getElementById('deleteModal').classList.remove('open')"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <p style="color:#374151;line-height:1.6;">আপনি কি নিশ্চিত যে এই পণ্যটি মুছে ফেলতে চান? এই কাজটি পূর্বাবস্থায় ফেরানো যাবে না।</p>
      <p style="font-weight:700;color:#1e293b;margin-top:12px;" id="deleteProductName"></p>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="document.getElementById('deleteModal').classList.remove('open')">বাতিল</button>
      <button class="btn btn-danger" onclick="confirmDelete()"><i class="fas fa-trash"></i> হ্যাঁ, মুছুন</button>
    </div>
  </div>
</div>

<!-- ===== ADMIN TOAST ===== -->
<div class="a-toast" id="adminToast">
  <i class="fas fa-check-circle"></i>
  <span id="adminToastMsg">সফল!</span>
</div>

<!-- ===== VERIFY REJECT MODAL ===== -->
<div class="modal-overlay" id="verifyRejectModal">
  <div class="modal-box" style="max-width:440px;">
    <div class="modal-header">
      <h3 style="color:var(--danger);"><i class="fas fa-circle-xmark" style="margin-right:8px;"></i>ভেরিফিকেশন প্রত্যাখ্যান</h3>
      <button class="modal-close" onclick="document.getElementById('verifyRejectModal').classList.remove('open')"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <input type="hidden" id="verifyRejectUid" />
      <div class="form-group">
        <label class="form-label">প্রত্যাখ্যানের কারণ <span style="color:var(--danger);">*</span></label>
        <textarea class="form-control" id="verifyRejectReason" rows="3" placeholder="যেমন: ছবি অস্পষ্ট, NID নম্বর বোঝা যাচ্ছে না..."></textarea>
      </div>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="document.getElementById('verifyRejectModal').classList.remove('open')">বাতিল</button>
      <button class="btn btn-danger" onclick="confirmVerifyReject()"><i class="fas fa-times"></i> প্রত্যাখ্যান করুন</button>
    </div>
  </div>
</div>

<!-- ===== VERIFY IMAGE PREVIEW MODAL ===== -->
<div class="modal-overlay" id="verifyImgModal" onclick="if(event.target===this)this.classList.remove('open')">
  <div class="modal-box" style="max-width:680px;">
    <div class="modal-header">
      <h3 id="verifyImgModalTitle">ডকুমেন্ট ছবি</h3>
      <button class="modal-close" onclick="document.getElementById('verifyImgModal').classList.remove('open')"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body" id="verifyImgModalBody" style="display:grid;gap:14px;">
    </div>
  </div>
</div>

<!-- ===== REVIEW EDIT MODAL ===== -->
<div class="modal-overlay" id="reviewModal">
  <div class="modal-box" style="max-width:520px;">
    <div class="modal-header">
      <h3 id="reviewModalTitle">নতুন রিভিউ</h3>
      <button class="modal-close" onclick="document.getElementById('reviewModal').classList.remove('open')"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <input type="hidden" id="rvId" />
      <div class="form-group"><label class="form-label">নাম</label><input class="form-control" id="rvName" type="text" /></div>
      <div class="form-group" style="margin-top:10px;"><label class="form-label">লোকেশন</label><input class="form-control" id="rvLoc" type="text" placeholder="ঢাকা" /></div>
      <div class="form-group" style="margin-top:10px;"><label class="form-label">অ্যাভাটার (১টি অক্ষর, ঐচ্ছিক)</label><input class="form-control" id="rvAvatar" type="text" maxlength="2" /></div>
      <div class="form-group" style="margin-top:10px;"><label class="form-label">রেটিং (১-৫)</label><input class="form-control" id="rvRating" type="number" min="1" max="5" value="5" /></div>
      <div class="form-group" style="margin-top:10px;"><label class="form-label">রিভিউ টেক্সট</label><textarea class="form-control" id="rvText" rows="4"></textarea></div>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="document.getElementById('reviewModal').classList.remove('open')">বাতিল</button>
      <button class="btn btn-primary" onclick="saveReview()"><i class="fas fa-save"></i> সংরক্ষণ</button>
    </div>
  </div>
</div>

<!-- ===== CATEGORY EDIT MODAL ===== -->
<div class="modal-overlay" id="categoryModal">
  <div class="modal-box" style="max-width:520px;">
    <div class="modal-header">
      <h3 id="categoryModalTitle">নতুন ক্যাটাগরি</h3>
      <button class="modal-close" onclick="document.getElementById('categoryModal').classList.remove('open')"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <input type="hidden" id="catId" />
      <div class="form-group"><label class="form-label">Key (lowercase, ইংরেজিতে, যেমন smartphone)</label><input class="form-control" id="catKey" type="text" /></div>
      <div class="form-group" style="margin-top:10px;"><label class="form-label">লেবেল (বাংলায় যা দেখাবে)</label><input class="form-control" id="catLabel" type="text" placeholder="স্মার্টফোন" /></div>
      <div class="form-group" style="margin-top:10px;"><label class="form-label">Font Awesome আইকন</label><input class="form-control" id="catIcon" type="text" placeholder="fas fa-mobile-alt" /></div>
      <div class="form-group" style="margin-top:10px;"><label class="form-label">অর্ডার (ছোট সংখ্যা আগে দেখাবে)</label><input class="form-control" id="catOrder" type="number" value="10" /></div>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="document.getElementById('categoryModal').classList.remove('open')">বাতিল</button>
      <button class="btn btn-primary" onclick="saveCategory()"><i class="fas fa-save"></i> সংরক্ষণ</button>
    </div>
  </div>
</div>

<!-- ===== ADD RESELLER MODAL ===== -->
<div class="modal-overlay" id="addResellerModal">
  <div class="modal-box" style="max-width:560px;">
    <div class="modal-header">
      <h3><i class="fas fa-user-plus" style="margin-right:8px;color:var(--primary);"></i>নতুন রিসেলার যোগ করুন</h3>
      <button class="modal-close" onclick="closeAddResellerModal()"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">👤 বেসিক তথ্য</div>
      <div class="form-grid">
        <div class="form-group form-full">
          <label class="form-label">পুরো নাম <span style="color:var(--danger);">*</span></label>
          <input type="text" class="form-control" id="newResellerName" placeholder="রিসেলারের নাম" />
        </div>
        <div class="form-group">
          <label class="form-label">ইমেইল <span style="color:var(--danger);">*</span></label>
          <input type="email" class="form-control" id="newResellerEmail" placeholder="example@mail.com" />
        </div>
        <div class="form-group">
          <label class="form-label">ফোন</label>
          <input type="text" class="form-control" id="newResellerPhone" placeholder="01XXXXXXXXX" />
        </div>
        <div class="form-group form-full">
          <label class="form-label">ঠিকানা</label>
          <input type="text" class="form-control" id="newResellerAddress" placeholder="ঠিকানা" />
        </div>
        <div class="form-group">
          <label class="form-label">টিয়ার</label>
          <select class="form-control" id="newResellerTier">
            <option value="bronze" selected>Bronze</option>
            <option value="silver">Silver</option>
            <option value="gold">Gold</option>
          </select>
        </div>
      </div>

      <div style="font-size:0.82rem;font-weight:700;color:var(--primary);margin:18px 0 12px;padding-bottom:6px;border-bottom:1px solid #f1f5f9;">💳 পেমেন্ট মেথড (ঐচ্ছিক)</div>
      <div class="form-grid">
        <div class="form-group">
          <label class="form-label">bKash নম্বর</label>
          <input type="text" class="form-control" id="newResellerBkash" placeholder="01XXXXXXXXX" />
        </div>
        <div class="form-group">
          <label class="form-label">Nagad নম্বর</label>
          <input type="text" class="form-control" id="newResellerNagad" placeholder="01XXXXXXXXX" />
        </div>
      </div>

      <p id="newResellerWarning" style="display:none;margin-top:12px;padding:10px 12px;background:#fef3c7;color:#92400e;border-radius:6px;font-size:0.85rem;line-height:1.5;"></p>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="closeAddResellerModal()">বাতিল</button>
      <button class="btn btn-primary" id="newResellerSaveBtn" onclick="submitNewReseller()">
        <i class="fas fa-save"></i> তৈরি করুন
      </button>
    </div>
  </div>
</div>

<!-- ===== RESELLER ORDER DETAIL MODAL ===== -->
<div class="modal-overlay" id="resellerOrderModal">
  <div class="modal-box" style="max-width:560px;">
    <div class="modal-header">
      <h3><i class="fas fa-receipt" style="margin-right:8px;color:var(--primary);"></i>রিসেলার অর্ডার বিবরণ <span id="roModalIdLabel" style="font-size:0.8rem;font-family:monospace;font-weight:700;color:#6c63ff;background:#ede9fe;padding:2px 10px;border-radius:20px;margin-left:6px;"></span></h3>
      <button class="modal-close" onclick="closeResellerOrderModal()"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body" id="resellerOrderModalBody"></div>
    <div class="modal-footer" style="flex-direction:column;align-items:stretch;gap:10px;">
      <!--
        READ-ONLY: রিসেলার অর্ডার বিবরণ পেজ থেকে Order Status Update ও Commission
        Status অপশন সম্পূর্ণভাবে সরানো হয়েছে।
        একমাত্র Source of Truth: Admin Panel → Orders → All Orders।
        সেখান থেকে status update করলে এই reseller order ও commission স্বয়ংক্রিয়ভাবে sync হবে।
      -->
      <div style="background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;padding:10px 14px;display:flex;align-items:center;gap:8px;font-size:0.82rem;color:#1e40af;">
        <i class="fas fa-info-circle"></i>
        <span>এই পেজটি শুধু তথ্য দেখায়। স্ট্যাটাস আপডেট করতে <strong>Orders → All Orders</strong> ব্যবহার করুন। সেখানকার আপডেট স্বয়ংক্রিয়ভাবে এখানে এবং কমিশনে প্রতিফলিত হবে।</span>
      </div>
      <button class="btn btn-outline btn-sm" onclick="closeResellerOrderModal()" style="align-self:flex-end;"><i class="fas fa-times"></i> বন্ধ করুন</button>
    </div>
  </div>
</div>

<!-- ===== WALLET LEDGER MODAL ===== -->
<!-- ===== RESELLER DETAIL POPUP ===== -->
<div class="modal-overlay" id="resellerDetailModal">
  <div class="modal-box" style="max-width:640px;">
    <div class="modal-header">
      <h3><i class="fas fa-user-circle" style="margin-right:8px;color:var(--primary);"></i>রিসেলার বিবরণ</h3>
      <button class="modal-close" onclick="closeResellerDetailModal()"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body" style="padding:0;">

      <!-- Info Section -->
      <div style="padding:20px 24px 16px;border-bottom:1px solid #f1f5f9;">
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;font-size:0.88rem;">
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:3px;">নাম</div>
            <div style="font-weight:700;color:#1e293b;" id="rdName">—</div>
          </div>
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:3px;">মোবাইল</div>
            <div style="font-weight:600;color:#374151;" id="rdPhone">—</div>
          </div>
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:3px;">ইমেইল</div>
            <div style="font-weight:600;color:#374151;word-break:break-all;" id="rdEmail">—</div>
          </div>
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:3px;">রিসেলার ID</div>
            <div style="font-family:monospace;font-size:0.78rem;color:#64748b;word-break:break-all;" id="rdUid">—</div>
          </div>
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:3px;">স্ট্যাটাস</div>
            <div id="rdStatus">—</div>
          </div>
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:3px;">যোগদানের তারিখ</div>
            <div style="color:#374151;font-size:0.85rem;" id="rdDate">—</div>
          </div>
        </div>
      </div>

      <!-- Order Stats -->
      <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;border-bottom:1px solid #f1f5f9;">
        <div style="padding:14px 20px;text-align:center;border-right:1px solid #f1f5f9;">
          <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:4px;">ডেলিভার্ড অর্ডার</div>
          <div style="font-size:1.4rem;font-weight:800;color:#10b981;" id="rdDelivered"><div class="spinner" style="width:20px;height:20px;margin:0 auto;"></div></div>
        </div>
        <div style="padding:14px 20px;text-align:center;border-right:1px solid #f1f5f9;">
          <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:4px;">বাতিল অর্ডার</div>
          <div style="font-size:1.4rem;font-weight:800;color:#ef4444;" id="rdCancelled"><div class="spinner" style="width:20px;height:20px;margin:0 auto;"></div></div>
        </div>
        <div style="padding:14px 20px;text-align:center;">
          <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:4px;">মোট অর্ডার</div>
          <div style="font-size:1.4rem;font-weight:800;color:#6c63ff;" id="rdTotal"><div class="spinner" style="width:20px;height:20px;margin:0 auto;"></div></div>
        </div>
      </div>

      <!-- Wallet Section -->
      <div style="padding:16px 24px;border-bottom:1px solid #f1f5f9;">
        <div style="font-size:0.78rem;font-weight:700;color:#1e293b;margin-bottom:12px;display:flex;align-items:center;gap:8px;">
          <i class="fas fa-wallet" style="color:var(--primary);"></i> ওয়ালেট তথ্য
          <span id="rdWalletStatusBadge" style="margin-left:auto;"></span>
        </div>
        <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:10px;" id="rdWalletGrid">
          <div style="background:#f8fafc;border-radius:10px;padding:10px 12px;">
            <div style="font-size:0.7rem;color:#94a3b8;margin-bottom:3px;">ব্যালেন্স</div>
            <div style="font-weight:800;color:var(--primary);font-size:1rem;" id="rdBalance"><div class="spinner" style="width:16px;height:16px;"></div></div>
          </div>
          <div style="background:#f8fafc;border-radius:10px;padding:10px 12px;">
            <div style="font-size:0.7rem;color:#94a3b8;margin-bottom:3px;">মোট আয়</div>
            <div style="font-weight:700;color:#10b981;font-size:0.95rem;" id="rdEarned">—</div>
          </div>
          <div style="background:#f8fafc;border-radius:10px;padding:10px 12px;">
            <div style="font-size:0.7rem;color:#94a3b8;margin-bottom:3px;">উত্তোলন</div>
            <div style="font-weight:700;color:#ef4444;font-size:0.95rem;" id="rdWithdrawn">—</div>
          </div>
          <div style="background:#f8fafc;border-radius:10px;padding:10px 12px;">
            <div style="font-size:0.7rem;color:#94a3b8;margin-bottom:3px;">পেন্ডিং</div>
            <div style="font-weight:700;color:#f59e0b;font-size:0.95rem;" id="rdPending">—</div>
          </div>
        </div>
      </div>

      <!-- Wallet Actions -->
      <div style="padding:14px 24px;display:flex;gap:10px;flex-wrap:wrap;">
        <button class="btn btn-outline btn-sm" onclick="rdOpenLedger()">
          <i class="fas fa-scroll"></i> ভিউ লেজার
        </button>
        <button class="btn btn-primary btn-sm" onclick="rdOpenAdjust()">
          <i class="fas fa-sliders-h"></i> ব্যালেন্স অ্যাডজাস্ট
        </button>
        <button class="btn btn-sm" id="rdSuspendBtn" onclick="rdToggleSuspend()" style="background:#f59e0b;color:#fff;border:none;">
          <i class="fas fa-ban"></i> সাসপেন্ড ওয়ালেট
        </button>
      </div>

    </div>
    <div class="modal-footer">
      <button class="btn btn-success btn-sm" id="rdApproveBtn" onclick="rdApprove()"><i class="fas fa-check"></i> অ্যাপ্রুভ</button>
      <button class="btn btn-danger btn-sm" id="rdRejectBtn" onclick="rdReject()"><i class="fas fa-times"></i> রিজেক্ট</button>
      <button class="btn btn-outline" onclick="closeResellerDetailModal()">বন্ধ করুন</button>
    </div>
  </div>
</div>

<div class="modal-overlay" id="walletLedgerModal">
  <div class="modal-box" style="max-width:680px;">
    <div class="modal-header">
      <h3><i class="fas fa-scroll" style="margin-right:8px;color:var(--primary);"></i>লেজার — <span id="ledgerResellerName">—</span></h3>
      <button class="modal-close" onclick="closeWalletLedgerModal(true)"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <div style="display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px;padding:14px;background:#f8fafc;border-radius:10px;">
        <div><div style="font-size:0.75rem;color:#64748b;">বর্তমান ব্যালেন্স</div><div style="font-weight:700;color:var(--primary);font-size:1.1rem;" id="ledgerCurrentBalance">৳০</div></div>
        <div><div style="font-size:0.75rem;color:#64748b;">মোট আয়</div><div style="font-weight:700;color:var(--success);" id="ledgerTotalEarned">৳০</div></div>
        <div><div style="font-size:0.75rem;color:#64748b;">মোট উত্তোলন</div><div style="font-weight:700;color:var(--secondary);" id="ledgerTotalWithdrawn">৳০</div></div>
      </div>
      <div style="overflow-x:auto;">
        <table class="product-table">
          <thead>
            <tr>
              <th>ধরন</th>
              <th>পরিমাণ</th>
              <th>ব্যালেন্স (পরে)</th>
              <th>বিবরণ</th>
              <th>তারিখ</th>
            </tr>
          </thead>
          <tbody id="walletLedgerBody">
            <tr><td colspan="5" class="loading-wrap"><div class="spinner"></div></td></tr>
          </tbody>
        </table>
      </div>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="closeWalletLedgerModal(false)">বন্ধ করুন</button>
    </div>
  </div>
</div>

<!-- ===== MANUAL WALLET ADJUSTMENT MODAL ===== -->
<div class="modal-overlay" id="walletAdjustModal">
  <div class="modal-box" style="max-width:460px;">
    <div class="modal-header">
      <h3><i class="fas fa-sliders-h" style="margin-right:8px;color:var(--primary);"></i>ম্যানুয়াল অ্যাডজাস্টমেন্ট</h3>
      <button class="modal-close" onclick="closeWalletAdjustModal(true)"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <p style="color:#64748b;font-size:0.85rem;margin-bottom:14px;">রিসেলার: <strong id="adjustResellerName" style="color:#1e293b;">—</strong> &nbsp;|&nbsp; বর্তমান ব্যালেন্স: <strong id="adjustCurrentBalance" style="color:var(--primary);">৳০</strong></p>
      <div class="form-group" style="margin-bottom:14px;">
        <label class="form-label">ধরন</label>
        <select class="form-control" id="adjustDirection">
          <option value="add">যোগ করুন (+)</option>
          <option value="subtract">বিয়োগ করুন (−)</option>
        </select>
      </div>
      <div class="form-group" style="margin-bottom:14px;">
        <label class="form-label">পরিমাণ (৳)</label>
        <input type="number" class="form-control" id="adjustAmount" min="0.01" step="0.01" placeholder="যেমন: 500" />
      </div>
      <div class="form-group">
        <label class="form-label">কারণ / নোট</label>
        <textarea class="form-control" id="adjustReason" rows="3" placeholder="কেন এই অ্যাডজাস্টমেন্ট করা হচ্ছে তা লিখুন..."></textarea>
      </div>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="closeWalletAdjustModal(false)">বাতিল</button>
      <button class="btn btn-primary" id="walletAdjustSaveBtn" onclick="submitWalletAdjustment()"><i class="fas fa-save"></i> সংরক্ষণ করুন</button>
    </div>
  </div>
</div>

<!-- ===== PAYOUT REJECT REASON MODAL ===== -->
<div class="modal-overlay" id="payoutRejectModal">
  <div class="modal-box" style="max-width:440px;">
    <div class="modal-header">
      <h3 style="color:var(--danger);"><i class="fas fa-times-circle" style="margin-right:8px;"></i>রিকুয়েস্ট রিজেক্ট করুন</h3>
      <button class="modal-close" onclick="closePayoutRejectModal()"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body">
      <p style="color:#64748b;font-size:0.85rem;margin-bottom:12px;">রিজেক্ট করার কারণ লিখুন — এটি রিসেলারকে নোটিফিকেশনের মাধ্যমে জানানো হবে। ব্যালেন্স অপরিবর্তিত থাকবে।</p>
      <textarea class="form-control" id="payoutRejectReason" rows="3" placeholder="যেমন: পেমেন্ট নাম্বার ভুল / অপর্যাপ্ত ব্যালেন্স যাচাই ইত্যাদি"></textarea>
    </div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="closePayoutRejectModal()">বাতিল</button>
      <button class="btn btn-danger" id="payoutRejectSaveBtn" onclick="submitPayoutReject()"><i class="fas fa-times"></i> রিজেক্ট নিশ্চিত করুন</button>
    </div>
  </div>
</div>

<!-- ===== GENERIC CONFIRM MODAL ===== -->
<div class="modal-overlay" id="genericConfirm">
  <div class="modal-box" style="max-width:420px;">
    <div class="modal-header">
      <h3 style="color:var(--danger);">⚠️ নিশ্চিত করুন</h3>
      <button class="modal-close" onclick="document.getElementById('genericConfirm').classList.remove('open')"><i class="fas fa-times"></i></button>
    </div>
    <div class="modal-body"><p id="genericConfirmMsg" style="color:#374151;line-height:1.6;">আপনি কি নিশ্চিত?</p></div>
    <div class="modal-footer">
      <button class="btn btn-outline" onclick="document.getElementById('genericConfirm').classList.remove('open')">বাতিল</button>
      <button class="btn btn-danger" id="genericConfirmOk">হ্যাঁ</button>
    </div>
  </div>
</div>

<!-- Firebase SDKs -->
<script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-auth-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.22.2/firebase-firestore-compat.js"></script>

<script>
  // ===== FIREBASE INIT =====
  const firebaseConfig = {
    apiKey: "AIzaSyDT4zy3wG7ERZKJYdRgaN54SODg_vVHao8",
    authDomain: "at-shop-bd591.firebaseapp.com",
    projectId: "at-shop-bd591",
    storageBucket: "at-shop-bd591.firebasestorage.app",
    messagingSenderId: "1006042887978",
    appId: "1:1006042887978:web:91787d4422a88e08999053",
    measurementId: "G-SDYCYRRX3Y"
  };
  firebase.initializeApp(firebaseConfig);
  const auth = firebase.auth();
  const db = firebase.firestore();

  // ===== STATE =====
  let allProducts = [];
  let allOrders = [];
  let filteredProducts = [];
  let currentEditId = null;
  let deleteTargetId = null;
  let currentOrderId = null;
  let cloudinaryConfig = { cloudName: '', uploadPreset: '' };
  const PAGE_SIZE = 15;
  let currentPage = 1;

  // ===== DEBOUNCE UTILITY =====
  function debounce(fn, delay) {
    let t;
    return function(...args) { clearTimeout(t); t = setTimeout(() => fn.apply(this, args), delay); };
  }

  // ===== AUTH =====
  // Keys for "Remember Me" expiry handling
  const REMEMBER_KEY  = 'at_admin_remember';     // '1' = remember me chosen
  const EXPIRY_KEY    = 'at_admin_expiry';       // timestamp (ms) when login expires
  const REMEMBER_DAYS = 3;

  // If a previously-remembered session has expired, sign out immediately
  // so the admin panel can NEVER be accessed without re-authenticating.
  (function enforceExpiry() {
    try {
      const expiry = parseInt(localStorage.getItem(EXPIRY_KEY) || '0', 10);
      if (expiry && Date.now() > expiry) {
        localStorage.removeItem(REMEMBER_KEY);
        localStorage.removeItem(EXPIRY_KEY);
        try { auth.signOut(); } catch (e) {}
      }
    } catch (e) { /* ignore */ }
  })();

  let _adminInited = false;
  auth.onAuthStateChanged(user => {
    if (user) {
      // Expiry check — EXPIRY_KEY থাকলে সময় দেখো, না থাকলে সবসময় pass
      const expiry = parseInt(localStorage.getItem(EXPIRY_KEY) || '0', 10);
      if (expiry && Date.now() > expiry) {
        localStorage.removeItem(REMEMBER_KEY);
        localStorage.removeItem(EXPIRY_KEY);
        auth.signOut();
        return;
      }

      // SECURITY: শুধুমাত্র userProfiles ডকুমেন্টে role: 'admin' থাকা ইউজারকেই
      // এডমিন প্যানেলে ঢুকতে দেওয়া হবে। অন্য কোনো (customer/reseller) একাউন্ট
      // দিয়ে লগইন সফল হলেও তাকে সাথে সাথে সাইন-আউট করে দেওয়া হবে।
      db.collection('userProfiles').doc(user.uid).get()
        .then(doc => {
          const role = doc.exists ? doc.data().role : null;
          if (role !== 'admin') {
            localStorage.removeItem(REMEMBER_KEY);
            localStorage.removeItem(EXPIRY_KEY);
            const errEl = document.getElementById('loginError');
            if (errEl) errEl.textContent = 'এই একাউন্টটি এডমিন নয়। প্রবেশের অনুমতি নেই।';
            document.getElementById('loginPage').style.display = 'flex';
            document.getElementById('adminApp').style.display = 'none';
            auth.signOut();
            return;
          }

          document.getElementById('loginPage').style.display = 'none';
          document.getElementById('adminApp').style.display = 'block';
          document.getElementById('adminEmail').textContent = user.email;
          if (!_adminInited) { _adminInited = true; initAdmin(); }
          // SEO: ensure all existing products have slug / seoTitle / seoDescription /
          // seoKeywords / canonicalUrl / productSchema / lastModified. Guarded internally.
          setTimeout(() => {
            if (typeof backfillProductSEO === 'function') {
              backfillProductSEO().catch(e => console.warn('SEO backfill skipped:', e.message));
            }
          }, 1500);
        })
        .catch(() => {
          // প্রোফাইল read ব্যর্থ হলে ফেইল-ক্লোজড — এডমিন প্যানেলে ঢুকতে দেওয়া হবে না
          localStorage.removeItem(REMEMBER_KEY);
          localStorage.removeItem(EXPIRY_KEY);
          const errEl = document.getElementById('loginError');
          if (errEl) errEl.textContent = 'লগইন যাচাই করা যায়নি। আবার চেষ্টা করুন।';
          document.getElementById('loginPage').style.display = 'flex';
          document.getElementById('adminApp').style.display = 'none';
          auth.signOut();
        });
    } else {
      document.getElementById('loginPage').style.display = 'flex';
      document.getElementById('adminApp').style.display = 'none';
    }
  });

  function doLogin() {
    const email = document.getElementById('loginEmail').value.trim();
    const pass = document.getElementById('loginPass').value;
    const remember = !!document.getElementById('rememberMe').checked;
    const errEl = document.getElementById('loginError');
    errEl.textContent = '';
    if (!email || !pass) { errEl.textContent = 'ইমেইল ও পাসওয়ার্ড দিন'; return; }

    // সবসময় LOCAL persistence — মোবাইলে SESSION persistence tab বন্ধে logout করে
    // Remember Me: checked → ৩ দিন, unchecked → ১ দিন
    const expiryDays = remember ? REMEMBER_DAYS : 1;

    auth.setPersistence(firebase.auth.Auth.Persistence.LOCAL)
      .then(() => auth.signInWithEmailAndPassword(email, pass))
      .then(cred => {
        localStorage.setItem(REMEMBER_KEY, '1');
        localStorage.setItem(
          EXPIRY_KEY,
          String(Date.now() + expiryDays * 24 * 60 * 60 * 1000)
        );
        // SECURITY FIX: এখানে আর নিজে থেকে role:'admin' সেট করা হয় না।
        // role:'admin' শুধুমাত্র Firestore-এ ম্যানুয়ালি সেট করা থাকলেই কাজ করবে।
        // চূড়ান্ত অনুমতি যাচাই onAuthStateChanged-এ role চেক করে হবে।
      })
      .catch(err => { errEl.textContent = 'লগইন ব্যর্থ! ইমেইল/পাসওয়ার্ড চেক করুন।'; });
  }

  function doLogout() {
    localStorage.removeItem(REMEMBER_KEY);
    localStorage.removeItem(EXPIRY_KEY);
    auth.signOut();
  }

  // ===== INIT ADMIN =====
  function initAdmin() {
    loadSettings();
    loadDashboard();
    listenProducts();
    listenOrders();
    listenResellers();
    listenResellerOrders();
    listenWallets();
    listenPayoutRequests();
    loadPayoutHistory();
    listenReferralBonusQueue();
    listenNotifications();
    listenVerifications();
    // New: content-management listeners
    listenMarquee();
    listenBanners();
    listenWhyChoose();
    listenReviews();
    listenSubscribers();
    listenQuickLinks();
    listenCategories();
    listenContactInfo();
    listenAboutPage();
    listenProductReviewsPanel();
    listenResellerHelpCenter();
    listenResellerLegalPages();

    listenLegalPages();
    if (window.innerWidth <= 768) {
      document.getElementById('sidebarToggle').style.display = 'flex';
    }
    // Debounced product search
    const searchInput = document.getElementById('productSearch');
    if (searchInput) {
      searchInput.addEventListener('input', debounce(function() {
        filterProductTable(this.value);
      }, 220));
    }
  }

  // ===== PAGE NAVIGATION =====
  // ===== COLLAPSIBLE NAV GROUPS =====
  function toggleNavGroup(groupId, header) {
    const body = document.getElementById(groupId);
    if (!body) return;
    const isOpen = body.classList.toggle('open');
    header.classList.toggle('open', isOpen);
  }

  // page → যে group-এ আছে সেটা auto-open করি
  const _pageGroupMap = {
    products: 'grpProducts', ordering: 'grpProducts',
    orders: 'grpOrders',
    resellers: 'grpResellers', verifications: 'grpResellers',
    resellerorders: 'grpResellers', payoutrequests: 'grpResellers',
    referralbonuses: 'grpResellers', notifications: 'grpResellers',
    resellerhelpcenter: 'grpResellers',
    resellerlegal: 'grpResellers',
    banners: 'grpContent', marquee: 'grpContent', whychoose: 'grpContent',
    reviews: 'grpContent', subscribers: 'grpContent', quicklinks: 'grpContent',
    categories: 'grpContent', contactinfo: 'grpContent', aboutus: 'grpContent',
    legalpages: 'grpContent'
  };

  function showPage(pageId, navItem) {
    document.querySelectorAll('.admin-page').forEach(p => p.classList.remove('active'));
    const target = document.getElementById('page-' + pageId);
    if (target) target.classList.add('active');
    document.querySelectorAll('.nav-item').forEach(n => n.classList.remove('active'));
    if (navItem) navItem.classList.add('active');

    // সংশ্লিষ্ট group auto-open করি
    const grpId = _pageGroupMap[pageId];
    if (grpId) {
      const body   = document.getElementById(grpId);
      const header = document.querySelector(`.nav-group-header[onclick*="${grpId}"]`);
      if (body)   body.classList.add('open');
      if (header) header.classList.add('open');
    }

    const titles = {
      dashboard:'ড্যাশবোর্ড', products:'পণ্য তালিকা', orders:'অর্ডার তালিকা', settings:'সেটিংস',
      marquee:'মার্কি টেক্সট', whychoose:'কেন আমাদের', reviews:'গ্রাহকদের রিভিউ',
      subscribers:'সাবস্ক্রাইবার', quicklinks:'কুইক লিংক', categories:'ক্যাটাগরি',
      contactinfo:'যোগাযোগ তথ্য', aboutus:'আমাদের সম্পর্কে',
      ordering:'পণ্যের ক্রম', legalpages:'পলিসি ও শর্তাবলী',
      resellers:'রিসেলার তালিকা', resellerorders:'রিসেলার অর্ডার',
      payoutrequests:'উইথড্রয়াল রিকুয়েস্ট', referralbonuses:'রেফারেল বোনাস',
      notifications:'নোটিফিকেশন', verifications:'ভেরিফিকেশন অনুরোধ',
      resellerhelpcenter:'রিসেলার হেল্প সেন্টার',
      resellerlegal:'রিসেলার শর্তাবলী ও গোপনীয়তা',
      banners:'ব্যানার স্লাইডার'
    };
    document.getElementById('topBarTitle').textContent = titles[pageId] || pageId;
    const sb = document.getElementById('sidebar');
    sb.classList.remove('open');
    const bd = document.getElementById('sidebarBackdrop');
    if (bd) bd.classList.remove('open');

    if (pageId === 'ordering' && typeof renderProductOrderingList === 'function') {
      renderProductOrderingList();
    }
  }

  function toggleSidebar() {
    const sb = document.getElementById('sidebar');
    const bd = document.getElementById('sidebarBackdrop');
    const isOpen = sb.classList.toggle('open');
    if (bd) bd.classList.toggle('open', isOpen);
  }

  // ===== MOBILE HELPER =====
  function isMobile() { return window.innerWidth <= 768; }

  // ===== TOAST =====
  let toastTimer;
  function adminToast(msg, type = 'success') {
    const toast = document.getElementById('adminToast');
    const msgEl = document.getElementById('adminToastMsg');
    const icon = toast.querySelector('i');
    msgEl.textContent = msg;
    toast.className = 'a-toast ' + type + ' show';
    icon.className = type === 'success' ? 'fas fa-check-circle' : 'fas fa-times-circle';
    clearTimeout(toastTimer);
    toastTimer = setTimeout(() => toast.classList.remove('show'), 3000);
  }

  // ===== REAL-TIME PRODUCT LISTENER =====
  function getDocSortTime(value) {
    if (!value) return 0;
    if (typeof value.toMillis === 'function') return value.toMillis();
    if (typeof value.seconds === 'number') return value.seconds * 1000;
    const parsed = Date.parse(value);
    return Number.isNaN(parsed) ? 0 : parsed;
  }

  function listenProducts() {
    db.collection('products')
      .onSnapshot(snapshot => {
        allProducts = snapshot.docs
          .map(doc => ({ id: doc.id, ...doc.data() }))
          .sort((a, b) => getDocSortTime(b.createdAt) - getDocSortTime(a.createdAt));
        filteredProducts = [...allProducts];
        allProductsCache = allProducts.map(p => ({ id: p.id, title: p.title || p.id }));
        renderProductTable(filteredProducts);
        document.getElementById('statProducts').textContent = allProducts.length;
        document.getElementById('statHot').textContent = allProducts.filter(p => p.hot).length;
        // Re-render review panel if it has loaded
        renderProductReviewsPanel();

        const ordPage = document.getElementById('page-ordering');
        if (ordPage && ordPage.classList.contains('active') && typeof renderProductOrderingList === 'function') {
          renderProductOrderingList();
        }
      }, err => console.error('listenProducts error:', err));
  }

  // ===== REAL-TIME ORDER LISTENER =====
  function listenOrders() {
    db.collection('orders').orderBy('createdAt', 'desc')
      .onSnapshot(snapshot => {
        allOrders = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
        renderOrderTable(allOrders);
        renderRecentOrders(allOrders.slice(0, 5));
        document.getElementById('statOrders').textContent = allOrders.length;
        document.getElementById('statPending').textContent = allOrders.filter(o => o.status === 'pending').length;
        document.getElementById('orderListCount').textContent = allOrders.length;
      }, err => {
        console.error('listenOrders error:', err.code, err.message);
        // index missing হলে link console এ দেখাবে
        ['statOrders','statPending','orderListCount'].forEach(id => {
          const el = document.getElementById(id);
          if (el && el.textContent === '—') el.textContent = '0';
        });
      });
  }

  // ===== REAL-TIME RESELLER LISTENER =====
  // Reads users/{uid} docs where role === 'reseller' and renders an
  // approve / reject management table. Status is stored as the field
  // `approvalStatus` with one of: 'pending' | 'approved' | 'rejected'.
  let allResellers = [];
  function listenResellers() {
    db.collection('userProfiles').where('role', '==', 'reseller')
      .onSnapshot(snapshot => {
        allResellers = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
        // Default any missing status to 'pending' purely for display.
        allResellers.forEach(r => {
          if (!r.approvalStatus) r.approvalStatus = 'pending';
        });
        if (typeof populateResellerOrderResellerFilter === 'function') populateResellerOrderResellerFilter();
        filterResellerTable();
        // Names are joined client-side from allResellers, so re-render
        // the wallet/payout tables whenever the reseller list refreshes.
        if (typeof filterWalletTable === 'function') filterWalletTable();
        if (typeof renderPayoutTable === 'function' && typeof allPayoutRequests !== 'undefined') renderPayoutTable(allPayoutRequests);
        // Notification recipient dropdowns + recipient name labels also
        // depend on allResellers, so refresh both alongside it.
        if (typeof populateNotificationRecipientDropdowns === 'function') populateNotificationRecipientDropdowns();
        if (typeof filterNotificationsTable === 'function') filterNotificationsTable();
        if (typeof filterVerifyTable === 'function') filterVerifyTable();
      }, err => {
        console.warn('[resellers] listener failed:', err);
        const body = document.getElementById('resellerTableBody');
        if (body) {
          body.innerHTML = '<tr><td colspan="7" style="text-align:center;padding:30px;color:#94a3b8;">রিসেলার ডেটা লোড করা যায়নি</td></tr>';
        }
      });
  }

  function filterResellerTable() {
    const q = normalizeAdminResellerSearch(document.getElementById('resellerSearch')?.value || '');
    const statusFilter = document.getElementById('resellerStatusFilter')?.value || '';
    const filtered = allResellers.filter(r => {
      if (statusFilter && r.approvalStatus !== statusFilter) return false;
      if (!q) return true;
      const name  = (r.fullName || r.displayName || r.name || '').toLowerCase();
      const email = (r.email || '').toLowerCase();
      const publicId = formatAdminResellerDisplayId(r).toLowerCase();
      return name.includes(q) || email.includes(q) || publicId.includes(q);
    });
    renderResellerTable(filtered);
  }

  function resellerStatusBadge(status) {
    const s = (status || 'pending').toLowerCase();
    if (s === 'approved') {
      return '<span class="badge-status badge-active"><i class="fas fa-check-circle"></i> অ্যাপ্রুভড</span>';
    }
    if (s === 'rejected') {
      return '<span class="badge-status badge-inactive"><i class="fas fa-times-circle"></i> রিজেক্টেড</span>';
    }
    return '<span class="badge-status" style="background:#fef3c7;color:#92400e;"><i class="fas fa-hourglass-half"></i> পেন্ডিং</span>';
  }

  /* ── সব জায়গায় একই অর্ডার আইডি ফরম্যাট: শেষ ৮ অক্ষর, বড় হাতে ── */
  function formatOrderId(id) {
    return '#' + String(id || '').slice(-8).toUpperCase();
  }

  function formatResellerDate(value) {
    if (!value) return '—';
    try {
      if (typeof value.toDate === 'function') return value.toDate().toLocaleDateString('bn-BD');
      if (typeof value.seconds === 'number') return new Date(value.seconds * 1000).toLocaleDateString('bn-BD');
      const d = new Date(value);
      if (!isNaN(d.getTime())) return d.toLocaleDateString('bn-BD');
    } catch (e) {}
    return '—';
  }

  function escapeHTML(str) {
    return String(str == null ? '' : str)
      .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
      .replace(/"/g, '&quot;').replace(/'/g, '&#39;');
  }

  function normalizeAdminResellerSearch(value) {
    return String(value || '')
      .trim()
      .toLowerCase()
      .replace(/^(id|আইডি)\s*[:：-]?\s*/i, '');
  }

  function getResellerProfileByUid(uid) {
    if (!uid) return null;
    return (allResellers || []).find(x => x && x.id === uid) || null;
  }

  function formatAdminResellerDisplayId(profileOrUid, fallbackUid) {
    const profile = (typeof profileOrUid === 'object' && profileOrUid)
      ? profileOrUid
      : getResellerProfileByUid(profileOrUid);
    const uid = fallbackUid || (typeof profileOrUid === 'string' ? profileOrUid : (profile && profile.id));
    const code = profile && (profile.resellerId || profile.resellerCode);
    if (typeof code === 'string' && code.trim()) return code.trim();
    return uid ? ('RSL-AT-' + String(uid).slice(-6).toUpperCase()) : '—';
  }

  function getVerificationDisplayId(v) {
    const uid = (v && (v.id || v.uid || v.userId || v.resellerUid)) || '';
    const profile = getResellerProfileByUid(uid);
    if (profile) return formatAdminResellerDisplayId(profile, uid);
    const directCode = v && (v.resellerCode || v.profileResellerId || v.publicResellerId);
    if (typeof directCode === 'string' && directCode.trim()) return directCode.trim();
    return formatAdminResellerDisplayId(uid);
  }

  function renderResellerTable(list) {
    const body = document.getElementById('resellerTableBody');
    if (!body) return;
    document.getElementById('resellerListCount').textContent = allResellers.length;

    if (!list.length) {
      body.innerHTML = '<tr><td colspan="7" style="text-align:center;padding:40px;color:#94a3b8;">কোনো রিসেলার পাওয়া যায়নি</td></tr>';
      return;
    }

    const table = document.getElementById('resellerTable');
    if (isMobile()) {
      if (table) table.classList.add('mobile-hide-table');
      let el = document.getElementById('resellerMobileCards');
      if (!el) { el = document.createElement('div'); el.id = 'resellerMobileCards'; table.parentNode.insertBefore(el, table); }
      el.className = 'mob-card-list';
      el.innerHTML = list.map(r => {
        const name = escapeHTML(r.fullName || r.displayName || r.name || '—');
        const phone = escapeHTML(r.phone || '—');
        const email = escapeHTML(r.email || '—');
        const uid = escapeHTML(r.id || '');
        const publicId = escapeHTML(formatAdminResellerDisplayId(r));
        const status = (r.approvalStatus || 'pending').toLowerCase();
        const date = escapeHTML(formatResellerDate(r.createdAt || r.appliedAt));
        const approveDisabled = status === 'approved' ? 'disabled style="opacity:0.45;cursor:not-allowed;"' : '';
        const rejectDisabled  = status === 'rejected' ? 'disabled style="opacity:0.45;cursor:not-allowed;"' : '';
        return `<div class="mob-card" onclick="openResellerDetailModal('${uid}')" style="cursor:pointer;">
          <div class="mob-card-header">
            <div><div class="mob-card-name">${name}</div><div class="mob-card-sub">${email}</div></div>
            ${resellerStatusBadge(status)}
          </div>
          <div class="mob-card-row"><span class="mob-card-label">রিসেলার ID</span><span class="mob-card-val" style="font-family:monospace;">${publicId}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">মোবাইল</span><span class="mob-card-val">${phone}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">আবেদনের তারিখ</span><span class="mob-card-val">${date}</span></div>
          <div class="mob-card-actions" onclick="event.stopPropagation()">
            <button class="btn btn-success btn-sm" ${approveDisabled} onclick="approveReseller('${uid}')"><i class="fas fa-check"></i> অ্যাপ্রুভ</button>
            <button class="btn btn-danger btn-sm" ${rejectDisabled} onclick="rejectReseller('${uid}')"><i class="fas fa-times"></i> রিজেক্ট</button>
          </div>
        </div>`;
      }).join('');
    } else {
      if (table) table.classList.remove('mobile-hide-table');
      const old = document.getElementById('resellerMobileCards');
      if (old) old.remove();
      body.innerHTML = list.map(r => {
        const name   = escapeHTML(r.fullName || r.displayName || r.name || '—');
        const phone  = escapeHTML(r.phone || '—');
        const email  = escapeHTML(r.email || '—');
        const uid    = escapeHTML(r.id || '');
        const publicId = escapeHTML(formatAdminResellerDisplayId(r));
        const status = (r.approvalStatus || 'pending').toLowerCase();
        const date   = escapeHTML(formatResellerDate(r.createdAt || r.appliedAt));
        const approveDisabled = status === 'approved' ? 'disabled style="opacity:0.45;cursor:not-allowed;"' : '';
        const rejectDisabled  = status === 'rejected' ? 'disabled style="opacity:0.45;cursor:not-allowed;"' : '';
        return `
          <tr onclick="openResellerDetailModal('${uid}')" style="cursor:pointer;">
            <td><strong>${name}</strong></td>
            <td>${phone}</td>
            <td>${email}</td>
            <td style="font-family:monospace;font-size:0.78rem;color:#64748b;">${publicId}</td>
            <td>${resellerStatusBadge(status)}</td>
            <td>${date}</td>
            <td onclick="event.stopPropagation()">
              <div class="actions-cell">
                <button class="btn btn-success btn-sm" ${approveDisabled} onclick="approveReseller('${uid}')">
                  <i class="fas fa-check"></i> অ্যাপ্রুভ
                </button>
                <button class="btn btn-danger btn-sm" ${rejectDisabled} onclick="rejectReseller('${uid}')">
                  <i class="fas fa-times"></i> রিজেক্ট
                </button>
              </div>
            </td>
          </tr>`;
      }).join('');
    }
  }

  // =====================================================================
  // =================== RESELLER DETAIL POPUP ==========================
  // =====================================================================
  let _rdCurrentUid = null;

  function openResellerDetailModal(uid) {
    if (!uid) return;
    _rdCurrentUid = uid;

    const r = (allResellers || []).find(x => x.id === uid) || {};
    const status = (r.approvalStatus || 'pending').toLowerCase();

    // Basic info
    document.getElementById('rdName').textContent    = r.fullName || r.displayName || r.name || '—';
    document.getElementById('rdPhone').textContent   = r.phone || '—';
    document.getElementById('rdEmail').textContent   = r.email || '—';
    document.getElementById('rdUid').textContent     = formatAdminResellerDisplayId(r, uid);
    document.getElementById('rdDate').textContent    = formatResellerDate(r.createdAt || r.appliedAt);
    document.getElementById('rdStatus').innerHTML    = resellerStatusBadge(status);

    // Approve/Reject buttons
    const approveBtn = document.getElementById('rdApproveBtn');
    const rejectBtn  = document.getElementById('rdRejectBtn');
    if (approveBtn) { approveBtn.disabled = status === 'approved'; approveBtn.style.opacity = status === 'approved' ? '0.45' : '1'; }
    if (rejectBtn)  { rejectBtn.disabled  = status === 'rejected'; rejectBtn.style.opacity  = status === 'rejected'  ? '0.45' : '1'; }

    // Reset wallet & order stats
    document.getElementById('rdDelivered').innerHTML = '<div class="spinner" style="width:20px;height:20px;margin:0 auto;"></div>';
    document.getElementById('rdCancelled').innerHTML = '<div class="spinner" style="width:20px;height:20px;margin:0 auto;"></div>';
    document.getElementById('rdTotal').innerHTML     = '<div class="spinner" style="width:20px;height:20px;margin:0 auto;"></div>';
    document.getElementById('rdBalance').innerHTML   = '<div class="spinner" style="width:16px;height:16px;"></div>';
    document.getElementById('rdEarned').textContent  = '—';
    document.getElementById('rdWithdrawn').textContent = '—';
    document.getElementById('rdPending').textContent   = '—';
    document.getElementById('rdWalletStatusBadge').innerHTML = '';

    document.getElementById('resellerDetailModal').classList.add('open');

    // Load order stats
    db.collection('resellerOrders').where('resellerId', '==', uid).get()
      .then(snap => {
        let delivered = 0, cancelled = 0;
        snap.forEach(d => {
          const s = (d.data().status || '').toLowerCase();
          if (s === 'delivered') delivered++;
          if (s === 'cancelled') cancelled++;
        });
        document.getElementById('rdDelivered').textContent = delivered;
        document.getElementById('rdCancelled').textContent = cancelled;
        document.getElementById('rdTotal').textContent     = snap.size;
      })
      .catch(() => {
        document.getElementById('rdDelivered').textContent = '—';
        document.getElementById('rdCancelled').textContent = '—';
        document.getElementById('rdTotal').textContent     = '—';
      });

    // Load wallet
    db.collection('resellerWallets').doc(uid).get()
      .then(snap => {
        const w = snap.exists ? snap.data() : {};
        document.getElementById('rdBalance').textContent   = '৳' + Number(w.balance   || 0).toLocaleString();
        document.getElementById('rdEarned').textContent    = '৳' + Number(w.totalEarned || 0).toLocaleString();
        document.getElementById('rdWithdrawn').textContent = '৳' + Number(w.totalWithdrawn || 0).toLocaleString();
        document.getElementById('rdPending').textContent   = '৳' + Number(w.pendingCommission || 0).toLocaleString();
        // wallet status badge + suspend button label
        const wStatus = (w.status || 'active').toLowerCase();
        document.getElementById('rdWalletStatusBadge').innerHTML = walletStatusBadge(wStatus);
        const suspendBtn = document.getElementById('rdSuspendBtn');
        if (suspendBtn) {
          if (wStatus === 'suspended') {
            suspendBtn.innerHTML = '<i class="fas fa-lock-open"></i> আনসাসপেন্ড';
            suspendBtn.style.background = '#10b981';
          } else {
            suspendBtn.innerHTML = '<i class="fas fa-ban"></i> সাসপেন্ড ওয়ালেট';
            suspendBtn.style.background = '#f59e0b';
          }
        }
      })
      .catch(() => {
        document.getElementById('rdBalance').textContent = 'N/A';
      });
  }

  function closeResellerDetailModal() {
    document.getElementById('resellerDetailModal').classList.remove('open');
    _rdCurrentUid = null;
  }

  // popup-এ Firestore থেকে load করা wallet data দিয়ে allWallets sync করে তারপর modal খোলে
  function _rdSyncWalletThenOpen(uid, openFn) {
    db.collection('resellerWallets').doc(uid).get()
      .then(snap => {
        const w = snap.exists ? { id: uid, ...snap.data() } : { id: uid };
        // allWallets-এ replace বা push করি
        if (!allWallets) allWallets = [];
        const idx = allWallets.findIndex(x => x.id === uid);
        if (idx >= 0) allWallets[idx] = w;
        else allWallets.push(w);
        openFn();
      })
      .catch(() => openFn()); // fetch fail হলেও modal খুলবে
  }

  function rdOpenLedger() {
    if (!_rdCurrentUid) return;
    const uid = _rdCurrentUid;
    // main popup শুধু hide করি, _rdCurrentUid রাখি যাতে ক্রসে back করা যায়
    document.getElementById('resellerDetailModal').classList.remove('open');
    _rdSyncWalletThenOpen(uid, () => openWalletLedgerModal(uid));
  }

  function rdOpenAdjust() {
    if (!_rdCurrentUid) return;
    const uid = _rdCurrentUid;
    document.getElementById('resellerDetailModal').classList.remove('open');
    _rdSyncWalletThenOpen(uid, () => openWalletAdjustModal(uid));
  }

  function rdToggleSuspend() {
    if (!_rdCurrentUid) return;
    const uid = _rdCurrentUid;
    closeResellerDetailModal();
    toggleWalletSuspend(uid);
  }

  function rdApprove() {
    if (!_rdCurrentUid) return;
    const uid = _rdCurrentUid;
    closeResellerDetailModal();
    approveReseller(uid);
  }

  function rdReject() {
    if (!_rdCurrentUid) return;
    const uid = _rdCurrentUid;
    closeResellerDetailModal();
    rejectReseller(uid);
  }

  /* ── Admin থেকে যেকোনো update এ notification পাঠানো ── */
  function sendNotification(recipientId, type, title, message, extra) {
    if (!recipientId) return Promise.resolve();
    return db.collection('notifications').add(Object.assign({
      recipientId: recipientId,
      type:        type,
      title:       title,
      message:     message,
      isRead:      false,
      sentBy:      'admin',
      createdAt:   firebase.firestore.FieldValue.serverTimestamp()
    }, extra || {})).catch(err => console.error('[notification] failed:', err));
  }

  function setResellerStatus(uid, status) {
    if (!uid) return Promise.reject(new Error('missing uid'));
    return db.collection('userProfiles').doc(uid).set({
      approvalStatus: status,
      approvalUpdatedAt: firebase.firestore.FieldValue.serverTimestamp()
    }, { merge: true });
  }

  function approveReseller(uid) {
    setResellerStatus(uid, 'approved')
      .then(() => sendNotification(uid, 'account',
        'অ্যাকাউন্ট অ্যাপ্রুভ হয়েছে ✅',
        'অভিনন্দন! আপনার রিসেলার অ্যাকাউন্ট অ্যাপ্রুভ করা হয়েছে। এখন আপনি পণ্য বিক্রি শুরু করতে পারবেন।'
      ))
      .then(() => adminToast('রিসেলার অ্যাপ্রুভ করা হয়েছে', 'success'))
      .catch(err => { console.error('[resellers] approve failed', err); adminToast('অ্যাপ্রুভ করা যায়নি', 'error'); });
  }

  function rejectReseller(uid) {
    setResellerStatus(uid, 'rejected')
      .then(() => sendNotification(uid, 'account',
        'অ্যাকাউন্ট রিজেক্ট হয়েছে ❌',
        'দুঃখিত, আপনার রিসেলার অ্যাকাউন্ট আবেদন প্রত্যাখ্যান করা হয়েছে। বিস্তারিত জানতে সাপোর্টে যোগাযোগ করুন।'
      ))
      .then(() => adminToast('রিসেলার রিজেক্ট করা হয়েছে', 'success'))
      .catch(err => { console.error('[resellers] reject failed', err); adminToast('রিজেক্ট করা যায়নি', 'error'); });
  }

  // =====================================================================
  // ===================== VERIFICATION MANAGEMENT =======================
  // =====================================================================
  let allVerifications = [];

  function listenVerifications() {
    db.collection('userVerifications')
      .onSnapshot(snapshot => {
        allVerifications = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
        // sort by submittedAt desc
        allVerifications.sort((a, b) => {
          const ta = a.submittedAt && typeof a.submittedAt.toMillis === 'function' ? a.submittedAt.toMillis() : 0;
          const tb = b.submittedAt && typeof b.submittedAt.toMillis === 'function' ? b.submittedAt.toMillis() : 0;
          return tb - ta;
        });
        filterVerifyTable();
      }, err => {
        console.warn('[verifications] listener failed:', err);
        const body = document.getElementById('verifyTableBody');
        if (body) body.innerHTML = '<tr><td colspan="6" style="text-align:center;padding:30px;color:#94a3b8;">ভেরিফিকেশন ডেটা লোড করা যায়নি</td></tr>';
      });
  }

  function filterVerifyTable() {
    const statusFilter = (document.getElementById('verifyStatusFilter') || {}).value || '';
    const q = normalizeAdminResellerSearch(document.getElementById('verifySearch')?.value || '');
    const filtered = (allVerifications || []).filter(v => {
      const status = (v.status || 'pending').toLowerCase();
      if (statusFilter && status !== statusFilter) return false;
      if (!q) return true;
      const uid = v.id || v.uid || v.userId || v.resellerUid || '';
      const profile = getResellerProfileByUid(uid) || {};
      const publicId = getVerificationDisplayId(v).toLowerCase();
      const name = (profile.fullName || profile.displayName || profile.name || v.fullName || v.name || '').toLowerCase();
      const email = (profile.email || v.email || '').toLowerCase();
      return publicId.includes(q) || name.includes(q) || email.includes(q);
    });
    document.getElementById('verifyListCount').textContent = allVerifications.length;
    renderVerifyTable(filtered);
  }

  function verifyStatusBadge(status) {
    const s = (status || 'pending').toLowerCase();
    if (s === 'approved') return '<span class="badge-status badge-active"><i class="fas fa-check-circle"></i> অ্যাপ্রুভড</span>';
    if (s === 'rejected') return '<span class="badge-status badge-inactive"><i class="fas fa-times-circle"></i> রিজেক্টেড</span>';
    return '<span class="badge-status" style="background:#fef3c7;color:#92400e;"><i class="fas fa-hourglass-half"></i> পেন্ডিং</span>';
  }

  function docTypeLabel(t) {
    if (t === 'nid') return '<span style="background:#ede9fe;color:#6c63ff;padding:3px 10px;border-radius:50px;font-size:0.78rem;font-weight:700;"><i class="fas fa-id-card"></i> NID কার্ড</span>';
    if (t === 'birth') return '<span style="background:#d1fae5;color:#065f46;padding:3px 10px;border-radius:50px;font-size:0.78rem;font-weight:700;"><i class="fas fa-certificate"></i> জন্মসনদ</span>';
    return t || '—';
  }

  function renderVerifyTable(list) {
    const body = document.getElementById('verifyTableBody');
    if (!body) return;
    if (!list.length) {
      body.innerHTML = '<tr><td colspan="6" style="text-align:center;padding:40px;color:#94a3b8;">কোনো ভেরিফিকেশন অনুরোধ নেই</td></tr>';
      return;
    }
    body.innerHTML = list.map(v => {
      const uid = escapeHTML(v.id || '');
      const publicId = escapeHTML(getVerificationDisplayId(v));
      const docType = v.docType || 'nid';
      const status = (v.status || 'pending').toLowerCase();
      const date = v.submittedAt
        ? (typeof v.submittedAt.toDate === 'function' ? v.submittedAt.toDate().toLocaleDateString('bn-BD') : '—')
        : '—';
      const approveDisabled = status === 'approved' ? 'disabled style="opacity:0.45;cursor:not-allowed;"' : '';
      const rejectDisabled  = status === 'rejected'  ? 'disabled style="opacity:0.45;cursor:not-allowed;"' : '';

      // Image thumbnails
      let imgHtml = '';
      if (docType === 'nid') {
        imgHtml = [v.nidFrontUrl, v.nidBackUrl].filter(Boolean).map(url =>
          `<img src="${escapeHTML(url)}" style="width:52px;height:38px;object-fit:cover;border-radius:6px;border:1.5px solid #e2e8f0;cursor:pointer;" onclick="openVerifyImgModal('${uid}')" title="বড় করে দেখুন" />`
        ).join('');
      } else {
        imgHtml = [v.birthCertUrl, v.birthSelfieUrl].filter(Boolean).map(url =>
          `<img src="${escapeHTML(url)}" style="width:52px;height:38px;object-fit:cover;border-radius:6px;border:1.5px solid #e2e8f0;cursor:pointer;" onclick="openVerifyImgModal('${uid}')" title="বড় করে দেখুন" />`
        ).join('');
      }
      if (!imgHtml) imgHtml = '<span style="color:#94a3b8;font-size:0.8rem;">ছবি নেই</span>';

      return `
        <tr>
          <td style="font-family:monospace;font-size:0.78rem;color:#64748b;">${publicId}</td>
          <td>${docTypeLabel(docType)}</td>
          <td><div style="display:flex;gap:6px;flex-wrap:wrap;align-items:center;">${imgHtml}</div></td>
          <td>${verifyStatusBadge(status)}</td>
          <td style="font-size:0.8rem;color:#64748b;">${date}</td>
          <td>
            <div class="actions-cell">
              <button class="btn btn-success btn-sm" ${approveDisabled} onclick="approveVerification('${uid}')">
                <i class="fas fa-check"></i> অ্যাপ্রুভ
              </button>
              <button class="btn btn-danger btn-sm" ${rejectDisabled} onclick="openVerifyRejectModal('${uid}')">
                <i class="fas fa-times"></i> রিজেক্ট
              </button>
            </div>
          </td>
        </tr>`;
    }).join('');
  }

  function approveVerification(uid) {
    if (!uid) return;
    db.collection('userVerifications').doc(uid).set({
      status: 'approved',
      approvedAt: firebase.firestore.FieldValue.serverTimestamp(),
      rejectionReason: null
    }, { merge: true })
      .then(() => sendNotification(uid, 'verify_approved',
        'ভেরিফিকেশন অনুমোদিত ✅',
        'আপনার পরিচয় সফলভাবে যাচাই করা হয়েছে। আপনার প্রোফাইলে এখন ভেরিফাইড ব্যাজ দেখাবে।'
      ))
      .then(() => adminToast('ভেরিফিকেশন অ্যাপ্রুভ করা হয়েছে ✅', 'success'))
      .catch(err => {
        console.error('[verify] approve failed', err);
        adminToast('অ্যাপ্রুভ করা যায়নি', 'error');
      });
  }

  function openVerifyRejectModal(uid) {
    document.getElementById('verifyRejectUid').value = uid;
    document.getElementById('verifyRejectReason').value = '';
    document.getElementById('verifyRejectModal').classList.add('open');
  }

  function confirmVerifyReject() {
    const uid = document.getElementById('verifyRejectUid').value;
    const reason = document.getElementById('verifyRejectReason').value.trim();
    if (!uid) return;
    if (!reason) {
      adminToast('প্রত্যাখ্যানের কারণ লিখুন', 'error');
      return;
    }

    db.collection('userVerifications').doc(uid).set({
      status: 'rejected',
      rejectedAt: firebase.firestore.FieldValue.serverTimestamp(),
      rejectionReason: reason
    }, { merge: true })
      .then(() => sendNotification(uid, 'verify_rejected',
        'ভেরিফিকেশন প্রত্যাখ্যাত ❌',
        'আপনার ভেরিফিকেশন অনুরোধ প্রত্যাখ্যান করা হয়েছে। কারণ: ' + reason + ' — প্রোফাইলে গিয়ে আবার সাবমিট করুন।'
      ))
      .then(() => {
        document.getElementById('verifyRejectModal').classList.remove('open');
        adminToast('ভেরিফিকেশন প্রত্যাখ্যান করা হয়েছে', 'success');
      })
      .catch(err => {
        console.error('[verify] reject failed', err);
        adminToast('রিজেক্ট করা যায়নি', 'error');
      });
  }

  function openVerifyImgModal(uid) {
    const v = allVerifications.find(x => x.id === uid);
    if (!v) return;
    const docType = v.docType || 'nid';
    const title = docType === 'nid' ? 'NID কার্ড ছবি' : 'জন্মসনদ ছবি';
    document.getElementById('verifyImgModalTitle').textContent = title;

    let images = [];
    if (docType === 'nid') {
      if (v.nidFrontUrl) images.push({ url: v.nidFrontUrl, label: 'সামনের পিঠ' });
      if (v.nidBackUrl)  images.push({ url: v.nidBackUrl,  label: 'পিছনের পিঠ' });
    } else {
      if (v.birthCertUrl)   images.push({ url: v.birthCertUrl,   label: 'জন্মসনদ' });
      if (v.birthSelfieUrl) images.push({ url: v.birthSelfieUrl, label: 'হাতে ধরা ছবি' });
    }

    // রিসেলারের প্রোফাইল তথ্য (account info + profile photo) — allResellers ক্যাশ থেকে
    const r = (allResellers || []).find(x => x.id === uid) || {};
    const profileName  = r.fullName || r.name || v.resellerName || '—';
    const profilePhone  = r.phone   || '—';
    const profileEmail  = r.email   || '—';
    const profileAddress = r.address || '—';
    const profileAvatar = r.avatarUrl || '';

    const accountInfoHtml = `
      <div style="display:flex;gap:14px;align-items:flex-start;padding-bottom:14px;border-bottom:1px solid #f1f5f9;">
        <div style="flex-shrink:0;width:64px;height:64px;border-radius:50%;overflow:hidden;background:#ede9fe;display:flex;align-items:center;justify-content:center;border:1.5px solid #e2e8f0;">
          ${profileAvatar
            ? `<img src="${escapeHTML(profileAvatar)}" style="width:100%;height:100%;object-fit:cover;" />`
            : `<i class="fas fa-user" style="color:#6c63ff;font-size:1.4rem;"></i>`}
        </div>
        <div style="flex:1;min-width:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;font-size:0.84rem;">
          <div style="grid-column:1 / -1;">
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:2px;">পূর্ণ নাম</div>
            <div style="font-weight:700;color:#1e293b;">${escapeHTML(profileName)}</div>
          </div>
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:2px;">মোবাইল নম্বর</div>
            <div style="font-weight:600;color:#374151;">${escapeHTML(profilePhone)}</div>
          </div>
          <div>
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:2px;">ইমেইল</div>
            <div style="font-weight:600;color:#374151;word-break:break-all;">${escapeHTML(profileEmail)}</div>
          </div>
          <div style="grid-column:1 / -1;">
            <div style="font-size:0.72rem;color:#94a3b8;font-weight:600;margin-bottom:2px;">ঠিকানা</div>
            <div style="font-weight:600;color:#374151;">${escapeHTML(profileAddress)}</div>
          </div>
        </div>
      </div>
      <div style="font-size:0.82rem;font-weight:700;color:#374151;margin-top:2px;">ডকুমেন্ট ছবি</div>
    `;

    const imagesHtml = images.map(img => `
      <div>
        <div style="font-size:0.82rem;font-weight:700;color:#374151;margin-bottom:8px;">${escapeHTML(img.label)}</div>
        <img src="${escapeHTML(img.url)}" style="width:100%;border-radius:10px;border:1.5px solid #e2e8f0;max-height:320px;object-fit:contain;background:#f8fafc;" />
      </div>
    `).join('');

    document.getElementById('verifyImgModalBody').innerHTML = accountInfoHtml + imagesHtml;

    document.getElementById('verifyImgModal').classList.add('open');
  }

  // Wire verify filter
  document.addEventListener('DOMContentLoaded', () => {
    const vf = document.getElementById('verifyStatusFilter');
    if (vf) vf.addEventListener('change', () => filterVerifyTable());
  });

  // =====================================================================
  // ===================== নোটিফিকেশন (notifications) ====================
  // =====================================================================
  // Admin can compose and send a notification to one specific reseller or
  // broadcast to all resellers. Each broadcast writes one notification doc
  // per recipient (recipientId set to that reseller's uid) so existing
  // per-user notification queries (recipientId == uid) keep working as-is.
  let allNotifications = [];

  // Recipient dropdowns (send-form + log filter) are populated from the
  // live `allResellers` array, so they auto-refresh as resellers change.
  function populateNotificationRecipientDropdowns() {
    const sendSel   = document.getElementById('notifRecipient');
    const filterSel = document.getElementById('notifFilterRecipient');
    if (!sendSel || !filterSel) return;

    const prevSend   = sendSel.value;
    const prevFilter = filterSel.value;

    let sendOpts = '<option value="__all__">📢 সবার জন্য ব্রডকাস্ট (সব রিসেলার)</option>';
    let filterOpts = '<option value="">সব প্রাপক</option>';
    allResellers.forEach(r => {
      const label = escHTML((r.fullName || r.displayName || r.name || r.email || r.id || '').toString());
      sendOpts += `<option value="${attr(r.id)}">${label}</option>`;
      filterOpts += `<option value="${attr(r.id)}">${label}</option>`;
    });

    sendSel.innerHTML = sendOpts;
    filterSel.innerHTML = filterOpts;

    // Re-select whatever was chosen before, if it still exists.
    if (prevSend && sendSel.querySelector(`option[value="${CSS.escape(prevSend)}"]`)) sendSel.value = prevSend;
    if (prevFilter && filterSel.querySelector(`option[value="${CSS.escape(prevFilter)}"]`)) filterSel.value = prevFilter;
  }

  function listenNotifications() {
    db.collection('notifications').orderBy('createdAt', 'desc')
      .onSnapshot(snapshot => {
        allNotifications = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
        filterNotificationsTable();
      }, err => {
        console.warn('[notifications] listener failed:', err);
        const body = document.getElementById('notifTableBody');
        if (body) {
          body.innerHTML = '<tr><td colspan="6" style="text-align:center;padding:30px;color:#94a3b8;">নোটিফিকেশন লোড করা যায়নি</td></tr>';
        }
      });
  }

  function notificationRecipientLabel(n) {
    if (n.recipientId === '__all__' || n.recipientRole === 'broadcast') return '📢 সবার জন্য (ব্রডকাস্ট)';
    const r = allResellers.find(x => x.id === n.recipientId);
    if (r) return escHTML(r.fullName || r.displayName || r.name || r.email || n.recipientId);
    return escHTML(n.recipientId || '—');
  }

  function notificationTypeBadge(type) {
    const labels = {
      system: 'সিস্টেম', promo: 'প্রমো', order_status: 'অর্ডার স্ট্যাটাস',
      wallet_credit: 'ওয়ালেট ক্রেডিট', wallet_adjustment: 'ওয়ালেট অ্যাডজাস্টমেন্ট',
      withdrawal_update: 'উইথড্রয়াল আপডেট'
    };
    const styles = {
      system: 'background:#e0e7ff;color:#3730a3', promo: 'background:#fce7f3;color:#9d174d',
      order_status: 'background:#dbeafe;color:#1e40af', wallet_credit: 'background:#d1fae5;color:#065f46',
      wallet_adjustment: 'background:#fef3c7;color:#92400e', withdrawal_update: 'background:#fef3c7;color:#92400e'
    };
    const style = styles[type] || 'background:#e2e8f0;color:#374151';
    return `<span class="badge-status" style="${style}">${labels[type] || escHTML(type || '—')}</span>`;
  }

  function filterNotificationsTable() {
    const recipientFilter = document.getElementById('notifFilterRecipient')?.value || '';
    const typeFilter = document.getElementById('notifFilterType')?.value || '';
    const filtered = allNotifications.filter(n => {
      if (recipientFilter && n.recipientId !== recipientFilter) return false;
      if (typeFilter && n.type !== typeFilter) return false;
      return true;
    });
    renderNotificationsTable(filtered);
  }

  function renderNotificationsTable(list) {
    const body = document.getElementById('notifTableBody');
    if (!body) return;
    document.getElementById('notifListCount').textContent = allNotifications.length;

    if (!list.length) {
      body.innerHTML = '<tr><td colspan="6" style="text-align:center;padding:40px;color:#94a3b8;">কোনো নোটিফিকেশন পাওয়া যায়নি</td></tr>';
      return;
    }

    body.innerHTML = list.map(n => {
      const title = escHTML(n.title || '—');
      const date = fmtTs(n.createdAt);
      const readBadge = n.isRead
        ? '<span class="badge-status badge-active"><i class="fas fa-check-double"></i> পঠিত</span>'
        : '<span class="badge-status" style="background:#fef3c7;color:#92400e;"><i class="fas fa-envelope"></i> অপঠিত</span>';

      return `
        <tr>
          <td>${notificationRecipientLabel(n)}</td>
          <td>${notificationTypeBadge(n.type)}</td>
          <td><strong>${title}</strong></td>
          <td>${date}</td>
          <td>${readBadge}</td>
          <td>
            <button class="btn btn-danger btn-sm" onclick="askDeleteNotification('${attr(n.id)}')">
              <i class="fas fa-trash"></i>
            </button>
          </td>
        </tr>`;
    }).join('');
  }

  function askDeleteNotification(id) {
    confirmModal('এই নোটিফিকেশনটি মুছে ফেলতে চান?', () => {
      db.collection('notifications').doc(id).delete()
        .then(() => adminToast('মুছে ফেলা হয়েছে', 'success'))
        .catch(e => { console.error(e); adminToast('মুছতে ব্যর্থ', 'error'); });
    });
  }

  function sendAdminNotification() {
    const recipientId = document.getElementById('notifRecipient').value;
    const type = document.getElementById('notifType').value;
    const title = document.getElementById('notifTitle').value.trim();
    const message = document.getElementById('notifMessage').value.trim();

    if (!recipientId) { adminToast('প্রাপক বেছে নিন', 'error'); return; }
    if (!title) { adminToast('শিরোনাম দিন', 'error'); return; }
    if (!message) { adminToast('বার্তা লিখুন', 'error'); return; }

    const sentBy = (auth.currentUser && (auth.currentUser.email || auth.currentUser.uid)) || 'admin';
    const sendBtn = document.getElementById('notifSendBtn');
    sendBtn.disabled = true;
    sendBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> পাঠানো হচ্ছে...';

    const finish = () => {
      sendBtn.disabled = false;
      sendBtn.innerHTML = '<i class="fas fa-paper-plane"></i> পাঠান';
    };

    let sendPromise;
    if (recipientId === '__all__') {
      // Broadcast: one notification document per current reseller.
      if (!allResellers.length) {
        adminToast('কোনো রিসেলার পাওয়া যায়নি', 'error');
        finish();
        return;
      }
      const batch = db.batch();
      const ts = firebase.firestore.FieldValue.serverTimestamp();
      allResellers.forEach(r => {
        const ref = db.collection('notifications').doc();
        batch.set(ref, {
          recipientId: r.id,
          recipientRole: 'reseller',
          type: type,
          title: title,
          message: message,
          isRead: false,
          sentBy: sentBy,
          createdAt: ts
        });
      });
      sendPromise = batch.commit();
    } else {
      sendPromise = db.collection('notifications').add({
        recipientId: recipientId,
        recipientRole: 'reseller',
        type: type,
        title: title,
        message: message,
        isRead: false,
        sentBy: sentBy,
        createdAt: firebase.firestore.FieldValue.serverTimestamp()
      });
    }

    sendPromise
      .then(() => {
        adminToast('নোটিফিকেশন পাঠানো হয়েছে ✅', 'success');
        document.getElementById('notifTitle').value = '';
        document.getElementById('notifMessage').value = '';
      })
      .catch(err => {
        console.error('[notifications] send failed', err);
        adminToast('পাঠাতে ব্যর্থ হয়েছে', 'error');
      })
      .finally(finish);
  }

  // =====================================================================
  // ===================== রিসেলার অর্ডার (resellerOrders) ===============
  // =====================================================================
  // Live-listens to the `resellerOrders` collection (same onSnapshot
  // pattern used for `products`/`orders` above). Crediting a commission
  // additionally touches resellerWallets/{resellerId}, its `transactions`
  // sub-collection, and `notifications` — all in a single batch.commit().
  let allResellerOrders = [];
  let currentResellerOrderId = null;

  function listenResellerOrders() {
    db.collection('resellerOrders').orderBy('createdAt', 'desc')
      .onSnapshot(snapshot => {
        allResellerOrders = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
        populateResellerOrderResellerFilter();
        filterResellerOrderTable();
      }, err => {
        console.warn('[resellerOrders] listener failed:', err);
        const body = document.getElementById('resellerOrderTableBody');
        if (body) {
          body.innerHTML = '<tr><td colspan="12" style="text-align:center;padding:30px;color:#94a3b8;">রিসেলার অর্ডার লোড করা যায়নি</td></tr>';
        }
      });
  }

  // Looks up a reseller's display name from the `allResellers` cache
  // (already loaded by listenResellers() for the রিসেলার তালিকা page).
  function getResellerNameById(id) {
    if (!id) return '—';
    const r = (allResellers || []).find(x => x.id === id);
    if (r) return r.fullName || r.displayName || r.name || r.email || id;
    return id;
  }

  function populateResellerOrderResellerFilter() {
    const sel = document.getElementById('roResellerFilter');
    if (!sel) return;
    const current = sel.value;
    const ids = new Map();
    (allResellers || []).forEach(r => ids.set(r.id, getResellerNameById(r.id)));
    (allResellerOrders || []).forEach(o => {
      if (o.resellerId && !ids.has(o.resellerId)) ids.set(o.resellerId, getResellerNameById(o.resellerId));
    });
    let html = '<option value="">সব রিসেলার</option>';
    Array.from(ids.entries())
      .sort((a, b) => String(a[1]).localeCompare(String(b[1]), 'bn'))
      .forEach(([id, name]) => { html += `<option value="${escHTML(id)}">${escHTML(name)}</option>`; });
    sel.innerHTML = html;
    if (current && ids.has(current)) sel.value = current;
  }

  function roStatusBadge(status) {
    const labels = { pending:'পেন্ডিং', confirmed:'কনফার্মড', processing:'প্রসেসিং', shipped:'শিপড', delivered:'ডেলিভারড', cancelled:'বাতিল' };
    const s = (status || 'pending').toLowerCase();
    return `<span class="order-status ro-${s}">${labels[s] || status || 'পেন্ডিং'}</span>`;
  }

  function roCommissionBadge(commissionStatus) {
    const labels = { unpaid:'অপরিশোধিত', held:'হোল্ড', credited:'ক্রেডিট হয়েছে' };
    const s = (commissionStatus || 'unpaid').toLowerCase();
    return `<span class="order-status comm-${s}">${labels[s] || commissionStatus || 'অপরিশোধিত'}</span>`;
  }

  /* ── Referral Source Badge ── */
  function roSourceBadge(referralSource) {
    if (referralSource === 'referral') {
      return `<span style="display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:0.72rem;font-weight:600;background:#ede9fe;color:#7c3aed;border:1px solid #c4b5fd;"><i class="fas fa-link" style="font-size:0.65rem;"></i> রেফারেল</span>`;
    }
    return `<span style="display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:0.72rem;font-weight:600;background:#f0fdf4;color:#15803d;border:1px solid #bbf7d0;"><i class="fas fa-pen" style="font-size:0.65rem;"></i> ম্যানুয়াল</span>`;
  }

  function renderResellerOrderTable(list) {
    const body = document.getElementById('resellerOrderTableBody');
    if (!body) return;
    document.getElementById('resellerOrderListCount').textContent = list.length;
    if (!list.length) {
      body.innerHTML = '<tr><td colspan="12" style="text-align:center;padding:40px;color:#94a3b8;">কোনো রিসেলার অর্ডার নেই</td></tr>';
      return;
    }
    const payLabel = { cod:'ক্যাশ অন ডেলিভারি', bkash:'bKash', nagad:'Nagad' };
    const table = document.getElementById('resellerOrderTable');
    if (isMobile()) {
      if (table) table.classList.add('mobile-hide-table');
      let el = document.getElementById('roMobileCards');
      if (!el) { el = document.createElement('div'); el.id = 'roMobileCards'; table.parentNode.insertBefore(el, table); }
      el.className = 'mob-card-list';
      el.innerHTML = list.map(o => {
        const createdLabel = o.createdAt ? formatResellerDate(o.createdAt) : '—';
        const thumb = o.productThumbnail || o.thumbnail || '';
        const thumbHtml = thumb
          ? `<img src="${escHTML(optimizeCloudinaryUrl(thumb))}" style="width:40px;height:40px;border-radius:8px;object-fit:cover;flex-shrink:0;" onerror="this.style.display='none'" />`
          : `<div style="width:40px;height:40px;border-radius:8px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;color:#94a3b8;flex-shrink:0;"><i class="fas fa-box"></i></div>`;
        return `<div class="mob-card" onclick="openResellerOrderModal('${o.id}')" style="cursor:pointer;">
          <div class="mob-card-header">
            <div style="display:flex;align-items:center;gap:10px;min-width:0;">
              ${thumbHtml}
              <div style="min-width:0;">
                <div class="mob-card-title">${escHTML(o.productTitle || '—')}</div>
                <div class="mob-card-sub">${escHTML(getResellerNameById(o.resellerId))}</div>
              </div>
            </div>
            ${roStatusBadge(o.status)}
          </div>
          <div class="mob-card-row"><span class="mob-card-label">অর্ডার আইডি</span><span class="mob-card-id">${escHTML(formatOrderId(o.mainOrderId || o.id))}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">গ্রাহক</span><span class="mob-card-val">${escHTML(o.customerName || '—')}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">মোট খরচ</span><span class="mob-price">৳${Number(o.totalCost||0).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">কমিশন</span><span class="mob-earn">৳${Number(o.commissionAmount||o.totalCommission||0).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">কমিশন স্ট্যাটাস</span>${roCommissionBadge(o.commissionStatus)}</div>
          <div class="mob-card-row"><span class="mob-card-label">তারিখ</span><span class="mob-card-val" style="font-size:0.8rem;color:#64748b;">${escHTML(createdLabel)}</span></div>
        </div>`;
      }).join('');
    } else {
      if (table) table.classList.remove('mobile-hide-table');
      const old = document.getElementById('roMobileCards');
      if (old) old.remove();
      body.innerHTML = list.map(o => {
        const thumb = o.productThumbnail || o.thumbnail || '';
        const thumbHtml = thumb
          ? `<img src="${escHTML(optimizeCloudinaryUrl(thumb))}" style="width:36px;height:36px;border-radius:6px;object-fit:cover;flex-shrink:0;" onerror="this.style.display='none'" />`
          : `<div style="width:36px;height:36px;border-radius:6px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;color:#94a3b8;flex-shrink:0;"><i class="fas fa-box"></i></div>`;
        const createdLabel = o.createdAt ? formatResellerDate(o.createdAt) : '—';
        return `
        <tr onclick="openResellerOrderModal('${o.id}')" style="cursor:pointer;">
          <td style="font-family:monospace;font-size:0.8rem;">${escHTML(formatOrderId(o.mainOrderId || o.id))}</td>
          <td style="font-weight:600;">${escHTML(getResellerNameById(o.resellerId))}</td>
          <td>
            <div style="display:flex;align-items:center;gap:8px;max-width:200px;">
              ${thumbHtml}
              <span style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">${escHTML(o.productTitle || '—')}</span>
            </div>
          </td>
          <td style="text-align:center;">${o.quantity != null ? o.quantity : '—'}</td>
          <td style="font-weight:700;color:var(--primary);">৳${Number(o.totalCost || 0).toLocaleString()}</td>
          <td style="font-weight:700;color:var(--success);">৳${Number(o.commissionAmount || o.totalCommission || 0).toLocaleString()}</td>
          <td>${roStatusBadge(o.status)}</td>
          <td>${roCommissionBadge(o.commissionStatus)}</td>
          <td>${roSourceBadge(o.referralSource)}</td>
          <td>${escHTML(payLabel[o.paymentMethod] || o.paymentMethod || '—')}</td>
          <td>${escHTML(o.customerName || '—')}</td>
          <td style="font-size:0.8rem;color:#64748b;">${escHTML(createdLabel)}</td>
        </tr>`;
      }).join('');
    }
  }

  function filterResellerOrderTable() {
    const status     = document.getElementById('roStatusFilter')?.value || '';
    const resellerId = document.getElementById('roResellerFilter')?.value || '';
    const rawQ = (document.getElementById('roSearch')?.value || '').trim();
    /* # দিলেও কাজ করবে */
    const q = rawQ.replace(/^#/, '').toLowerCase();
    const filtered = (allResellerOrders || []).filter(o => {
      if (status     && o.status           !== status)     return false;
      if (resellerId && o.resellerId       !== resellerId) return false;
      if (q) {
        /* user যে ID দেখছে — mainOrderId থাকলে সেটা, না থাকলে নিজের id */
        const shownId      = String(o.mainOrderId || o.id || '').slice(-8).toLowerCase();
        const shownFull    = String(o.mainOrderId || o.id || '').toLowerCase();
        const ownId        = String(o.id || '').toLowerCase();
        const resellerName = getResellerNameById(o.resellerId).toLowerCase();
        const resellerIdLc = String(o.resellerId || '').toLowerCase();
        const custName     = String(o.customerName || '').toLowerCase();
        const custPhone    = String(o.customerPhone || '').toLowerCase();
        const custAddr     = String(o.customerAddress || '').toLowerCase();
        const productTitle = String(o.productTitle || '').toLowerCase();
        const orderNumber  = String(o.orderNumber || '').toLowerCase();
        if (!shownId.includes(q)
         && !shownFull.includes(q)
         && !ownId.includes(q)
         && !resellerName.includes(q)
         && !resellerIdLc.includes(q)
         && !custName.includes(q)
         && !custPhone.includes(q)
         && !custAddr.includes(q)
         && !productTitle.includes(q)
         && !orderNumber.includes(q)) return false;
      }
      return true;
    });
    renderResellerOrderTable(filtered);
  }

  // ===== RESELLER ORDER DETAIL MODAL =====
  function openResellerOrderModal(id) {
    const order = allResellerOrders.find(o => o.id === id);
    if (!order) return;
    currentResellerOrderId = id;
    // READ-ONLY: রিসেলার অর্ডার বিবরণ পেজ থেকে Order Status / Commission Status /
    // Admin Note এডিট অপশন সরানো হয়েছে। স্ট্যাটাস আপডেট হবে শুধুমাত্র
    // Admin Panel → Orders → All Orders থেকে।
    const roLabel = document.getElementById('roModalIdLabel');
    if (roLabel) roLabel.textContent = formatOrderId(order.mainOrderId || id);

    const payLabel = { cod:'ক্যাশ অন ডেলিভারি', bkash:'bKash', nagad:'Nagad' };
    const thumb = order.productThumbnail || order.thumbnail || '';
    const createdLabel = order.createdAt ? formatResellerDate(order.createdAt) : '—';

    document.getElementById('resellerOrderModalBody').innerHTML = `
      <div style="display:grid;gap:10px;">
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">রিসেলার</div>
            <div style="font-weight:700;">${escHTML(getResellerNameById(order.resellerId))}</div>
          </div>
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">অর্ডার আইডি</div>
            <div style="font-weight:700;font-family:monospace;">${escHTML(formatOrderId(order.mainOrderId || order.id))}</div>
          </div>
        </div>
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">গ্রাহকের নাম</div>
            <div style="font-weight:700;">${escHTML(order.customerName || '—')}</div>
          </div>
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">ফোন</div>
            <div style="font-weight:700;">${escHTML(order.customerPhone || '—')}</div>
          </div>
        </div>
        <div style="background:#f8fafc;border-radius:8px;padding:14px;">
          <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">ঠিকানা</div>
          <div style="font-weight:600;">${escHTML(order.customerAddress || '—')}</div>
        </div>
        <div style="background:#f8fafc;border-radius:8px;padding:14px;">
          <div style="font-size:0.75rem;color:#64748b;margin-bottom:8px;">পণ্য</div>
          <div style="display:flex;align-items:center;gap:10px;">
            ${thumb ? `<img src="${escHTML(optimizeCloudinaryUrl(thumb))}" style="width:48px;height:48px;border-radius:8px;object-fit:cover;" onerror="this.style.display='none'" />` : ''}
            <div style="flex:1;">
              <div style="font-weight:700;">${escHTML(order.productTitle || '—')}</div>
              <div style="font-size:0.8rem;color:#64748b;">পরিমাণ: ${order.quantity != null ? order.quantity : '—'}টি</div>
            </div>
          </div>
        </div>
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
          <div style="background:#f0fdf4;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">মোট খরচ</div>
            <div style="font-weight:700;color:var(--primary);">৳${Number(order.totalCost || 0).toLocaleString()}</div>
          </div>
          <div style="background:#f0fdf4;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">মোট কমিশন</div>
            <div style="font-weight:700;color:var(--success);">৳${Number(order.commissionAmount || order.totalCommission || 0).toLocaleString()}</div>
          </div>
        </div>
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">পেমেন্ট মেথড</div>
            <div style="font-weight:700;">${escHTML(payLabel[order.paymentMethod] || order.paymentMethod || '—')}</div>
          </div>
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">তারিখ</div>
            <div style="font-weight:700;">${escHTML(createdLabel)}</div>
          </div>
        </div>
        <div style="display:flex;gap:10px;align-items:center;flex-wrap:wrap;">
          <div>${roStatusBadge(order.status)}</div>
          <div>${roCommissionBadge(order.commissionStatus)}</div>
          <div>${roSourceBadge(order.referralSource)}</div>
        </div>
        ${order.orderNumber ? `
        <div style="background:#fffbeb;border:1px solid #fde68a;border-radius:8px;padding:12px 14px;">
          <div style="font-size:0.75rem;color:#92400e;margin-bottom:4px;">ম্যানুয়াল অর্ডার নম্বর</div>
          <div style="font-weight:700;font-family:monospace;color:#92400e;">${escHTML(order.orderNumber)}</div>
        </div>` : ''}
      </div>`;

    document.getElementById('resellerOrderModal').classList.add('open');
  }

  function closeResellerOrderModal() {
    document.getElementById('resellerOrderModal').classList.remove('open');
    currentResellerOrderId = null;
  }

  // REMOVED: updateResellerOrderStatus()
  // রিসেলার অর্ডার ডিটেইল পেজ থেকে Order Status আপডেট অপশন সম্পূর্ণভাবে সরানো হয়েছে।
  // একমাত্র Source of Truth: Admin Panel → Orders → All Orders → updateOrderStatus()।
  // সেখান থেকে স্ট্যাটাস আপডেট করলে এই reseller order, কমিশন, ওয়ালেট ও
  // ওয়েবসাইট ইউজারের order history সবই স্বয়ংক্রিয়ভাবে sync হয়।

  // REMOVED: updateResellerOrderCommissionStatus()
  // Commission Status ফিচার পুরোপুরি সরানো হয়েছে। কমিশন এখন Order Status
  // অনুসারে স্বয়ংক্রিয়ভাবে হিসাব ও ক্রেডিট হয়:
  //   • pending → confirmed/processing/shipped → pendingCommission এ যোগ
  //   • delivered → balance + totalEarned এ যোগ
  //   • cancelled → পূর্বের অবস্থা অনুযায়ী revert
  // পুরো লজিক আছে updateOrderStatus() ফাংশনে।

  // REMOVED: saveResellerOrderAdminNote()
  // রিসেলার অর্ডার ডিটেইল মোডাল এখন read-only — admin note এডিট অপশনও নেই।

  // =====================================================================
  // ===================== ওয়ালেট ও পেআউট (resellerWallets) =============
  // =====================================================================
  // Live-listens to `resellerWallets`, joining each wallet doc with the
  // reseller's display name from the `allResellers` cache (loaded by
  // listenResellers() above). The balance field is NEVER written directly
  // outside of this block — every change goes through a batch.commit()
  // that writes a matching `transactions` sub-doc in the same atomic write,
  // mirroring the pattern already used for commission crediting.
  let allWallets = [];
  let currentLedgerResellerId = null;
  let currentAdjustResellerId = null;

  function listenWallets() {
    db.collection('resellerWallets')
      .onSnapshot(snapshot => {
        allWallets = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
        filterWalletTable();
      }, err => {
        console.warn('[wallets] listener failed:', err);
        const body = document.getElementById('walletTableBody');
        if (body) {
          body.innerHTML = '<tr><td colspan="8" style="text-align:center;padding:30px;color:#94a3b8;">ওয়ালেট ডেটা লোড করা যায়নি</td></tr>';
        }
      });
  }

  function walletStatusBadge(status) {
    const s = (status || 'active').toLowerCase();
    if (s === 'suspended') {
      return '<span class="badge-status badge-inactive"><i class="fas fa-ban"></i> স্থগিত</span>';
    }
    return '<span class="badge-status badge-active"><i class="fas fa-check-circle"></i> সক্রিয়</span>';
  }

  function filterWalletTable() {
    const q = (document.getElementById('walletSearch')?.value || '').trim().toLowerCase();
    const statusFilter = document.getElementById('walletStatusFilter')?.value || '';
    const filtered = (allWallets || []).filter(w => {
      if (statusFilter && (w.status || 'active') !== statusFilter) return false;
      if (!q) return true;
      const name = getResellerNameById(w.id).toLowerCase();
      return name.includes(q);
    });
    renderWalletTable(filtered);
  }

  function renderWalletTable(list) {
    const body = document.getElementById('walletTableBody');
    if (!body) return; // page-walletoverview সরানো হয়েছে, silently return
    const countEl = document.getElementById('walletListCount');
    if (countEl) countEl.textContent = (allWallets || []).length;

    if (!list.length) {
      body.innerHTML = '<tr><td colspan="8" style="text-align:center;padding:40px;color:#94a3b8;">কোনো ওয়ালেট পাওয়া যায়নি</td></tr>';
      return;
    }

    const table = document.getElementById('walletTable');
    if (isMobile()) {
      if (table) table.classList.add('mobile-hide-table');
      let el = document.getElementById('walletMobileCards');
      if (!el) { el = document.createElement('div'); el.id = 'walletMobileCards'; table.parentNode.insertBefore(el, table); }
      el.className = 'mob-card-list';
      el.innerHTML = list.map(w => {
        const name = escHTML(getResellerNameById(w.id));
        const status = (w.status || 'active').toLowerCase();
        const suspendLabel = status === 'suspended' ? 'আনসাসপেন্ড' : 'সাসপেন্ড';
        const suspendIcon = status === 'suspended' ? 'fa-lock-open' : 'fa-ban';
        const suspendBtnClass = status === 'suspended' ? 'btn-success' : 'btn-warning';
        return `<div class="mob-card">
          <div class="mob-card-header">
            <div class="mob-card-name">${name}</div>
            ${walletStatusBadge(w.status)}
          </div>
          <div class="mob-card-row"><span class="mob-card-label">ব্যালেন্স</span><span class="mob-price">৳${Number(w.balance||0).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">মোট আয়</span><span class="mob-earn">৳${Number(w.totalEarned||0).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">মোট উত্তোলন</span><span class="mob-card-val" style="color:var(--secondary);">৳${Number(w.totalWithdrawn||0).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">পেন্ডিং কমিশন</span><span class="mob-card-val">৳${Number(w.pendingCommission||0).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">শেষ লেনদেন</span><span class="mob-card-val" style="font-size:0.8rem;color:#64748b;">${escHTML(fmtTs(w.lastTransactionAt))}</span></div>
          <div class="mob-card-actions">
            <button class="btn btn-outline btn-sm" onclick="openWalletLedgerModal('${w.id}')"><i class="fas fa-scroll"></i> লেজার</button>
            <button class="btn btn-primary btn-sm" onclick="openWalletAdjustModal('${w.id}')"><i class="fas fa-sliders-h"></i> অ্যাডজাস্ট</button>
            <button class="btn ${suspendBtnClass} btn-sm" onclick="toggleWalletSuspend('${w.id}')"><i class="fas ${suspendIcon}"></i> ${suspendLabel}</button>
          </div>
        </div>`;
      }).join('');
    } else {
      if (table) table.classList.remove('mobile-hide-table');
      const old = document.getElementById('walletMobileCards');
      if (old) old.remove();
      body.innerHTML = list.map(w => {
        const name = escHTML(getResellerNameById(w.id));
        const status = (w.status || 'active').toLowerCase();
        const suspendLabel = status === 'suspended' ? 'আনসাসপেন্ড' : 'সাসপেন্ড ওয়ালেট';
        const suspendIcon = status === 'suspended' ? 'fa-lock-open' : 'fa-ban';
        const suspendBtnClass = status === 'suspended' ? 'btn-success' : 'btn-warning';
        return `
          <tr>
            <td><strong>${name}</strong></td>
            <td style="font-weight:700;color:var(--primary);">৳${Number(w.balance || 0).toLocaleString()}</td>
            <td style="color:var(--success);">৳${Number(w.totalEarned || 0).toLocaleString()}</td>
            <td style="color:var(--secondary);">৳${Number(w.totalWithdrawn || 0).toLocaleString()}</td>
            <td>৳${Number(w.pendingCommission || 0).toLocaleString()}</td>
            <td>${walletStatusBadge(w.status)}</td>
            <td style="font-size:0.8rem;color:#64748b;">${escHTML(fmtTs(w.lastTransactionAt))}</td>
            <td>
              <div class="actions-cell" style="flex-wrap:wrap;">
                <button class="btn btn-outline btn-sm" onclick="openWalletLedgerModal('${w.id}')">
                  <i class="fas fa-scroll"></i> ভিউ লেজার
                </button>
                <button class="btn btn-primary btn-sm" onclick="openWalletAdjustModal('${w.id}')">
                  <i class="fas fa-sliders-h"></i> অ্যাডজাস্ট
                </button>
                <button class="btn ${suspendBtnClass} btn-sm" onclick="toggleWalletSuspend('${w.id}')">
                  <i class="fas ${suspendIcon}"></i> ${suspendLabel}
                </button>
              </div>
            </td>
          </tr>`;
      }).join('');
    }
  }

  // ----- সাসপেন্ড ওয়ালেট টগল -----
  function toggleWalletSuspend(resellerId) {
    const wallet = (allWallets || []).find(w => w.id === resellerId);
    const current = (wallet && wallet.status) || 'active';
    const next = current === 'suspended' ? 'active' : 'suspended';
    const name = getResellerNameById(resellerId);
    const verb = next === 'suspended' ? 'সাসপেন্ড' : 'আনসাসপেন্ড';

    confirmModal(`আপনি কি "${name}" এর ওয়ালেট ${verb} করতে চান?` +
      (next === 'suspended' ? ' সাসপেন্ড অবস্থায় রিসেলার নতুন উইথড্রয়াল রিকুয়েস্ট করতে পারবে না।' : ''),
      () => {
        db.collection('resellerWallets').doc(resellerId).set({
          status: next,
          statusUpdatedAt: firebase.firestore.FieldValue.serverTimestamp()
        }, { merge: true })
          .then(() => adminToast(`ওয়ালেট ${verb} করা হয়েছে ✅`))
          .catch(err => {
            console.error('[wallets] suspend toggle failed', err);
            adminToast('স্ট্যাটাস পরিবর্তন ব্যর্থ', 'error');
          });
      });
  }

  // ----- ভিউ লেজার (transactions sub-collection, createdAt desc) -----
  function openWalletLedgerModal(resellerId) {
    currentLedgerResellerId = resellerId;
    const wallet = (allWallets || []).find(w => w.id === resellerId) || {};
    document.getElementById('ledgerResellerName').textContent = getResellerNameById(resellerId);
    document.getElementById('ledgerCurrentBalance').textContent = '৳' + Number(wallet.balance || 0).toLocaleString();
    document.getElementById('ledgerTotalEarned').textContent = '৳' + Number(wallet.totalEarned || 0).toLocaleString();
    document.getElementById('ledgerTotalWithdrawn').textContent = '৳' + Number(wallet.totalWithdrawn || 0).toLocaleString();

    const body = document.getElementById('walletLedgerBody');
    body.innerHTML = '<tr><td colspan="5" class="loading-wrap"><div class="spinner"></div></td></tr>';
    document.getElementById('walletLedgerModal').classList.add('open');

    db.collection('resellerWallets').doc(resellerId).collection('transactions')
      .orderBy('createdAt', 'desc')
      .get()
      .then(snap => {
        if (currentLedgerResellerId !== resellerId) return; // modal switched/closed before this resolved
        if (snap.empty) {
          body.innerHTML = '<tr><td colspan="5" style="text-align:center;padding:30px;color:#94a3b8;">কোনো লেনদেন নেই</td></tr>';
          return;
        }
        body.innerHTML = snap.docs.map(doc => {
          const t = doc.data();
          return `
            <tr>
              <td>${txnTypeBadge(t.type)}</td>
              <td style="font-weight:700;color:${txnAmountColor(t.type)};">${txnAmountSign(t.type)}৳${Number(t.amount || 0).toLocaleString()}</td>
              <td>৳${Number(t.balanceAfter || 0).toLocaleString()}</td>
              <td style="max-width:260px;white-space:normal;">${escHTML(t.description || '—')}</td>
              <td style="font-size:0.8rem;color:#64748b;white-space:nowrap;">${escHTML(fmtTs(t.createdAt))}</td>
            </tr>`;
        }).join('');
      })
      .catch(err => {
        console.error('[wallets] ledger load failed', err);
        body.innerHTML = '<tr><td colspan="5" style="text-align:center;padding:30px;color:#94a3b8;">লেজার লোড করা যায়নি</td></tr>';
      });
  }

  function closeWalletLedgerModal(returnToMain) {
    document.getElementById('walletLedgerModal').classList.remove('open');
    currentLedgerResellerId = null;
    if (returnToMain && _rdCurrentUid) {
      openResellerDetailModal(_rdCurrentUid);
    } else if (!returnToMain) {
      closeResellerDetailModal();
    }
  }

  function txnTypeBadge(type) {
    const labels = { credit:'ক্রেডিট', debit:'ডেবিট', adjustment:'অ্যাডজাস্টমেন্ট' };
    const styles = {
      credit: 'background:#d1fae5;color:#065f46',
      debit: 'background:#fee2e2;color:#991b1b',
      adjustment: 'background:#fef3c7;color:#92400e'
    };
    const style = styles[type] || 'background:#e2e8f0;color:#374151';
    return `<span class="badge-status" style="${style}">${labels[type] || type || '—'}</span>`;
  }
  function txnAmountColor(type) {
    if (type === 'debit') return 'var(--secondary)';
    return 'var(--success)';
  }
  function txnAmountSign(type) {
    return type === 'debit' ? '−' : '+';
  }

  // ----- ম্যানুয়াল অ্যাডজাস্টমেন্ট -----
  // Never writes `balance` directly: writes a `transactions` doc with
  // type:'adjustment' and bumps the wallet's balance via
  // FieldValue.increment in the SAME batch, so the two are always in sync.
  function openWalletAdjustModal(resellerId) {
    currentAdjustResellerId = resellerId;
    const wallet = (allWallets || []).find(w => w.id === resellerId) || {};
    document.getElementById('adjustResellerName').textContent = getResellerNameById(resellerId);
    document.getElementById('adjustCurrentBalance').textContent = '৳' + Number(wallet.balance || 0).toLocaleString();
    document.getElementById('adjustDirection').value = 'add';
    document.getElementById('adjustAmount').value = '';
    document.getElementById('adjustReason').value = '';
    document.getElementById('walletAdjustModal').classList.add('open');
  }

  function closeWalletAdjustModal(returnToMain) {
    document.getElementById('walletAdjustModal').classList.remove('open');
    currentAdjustResellerId = null;
    if (returnToMain && _rdCurrentUid) {
      openResellerDetailModal(_rdCurrentUid);
    } else if (!returnToMain) {
      closeResellerDetailModal();
    }
  }

  function submitWalletAdjustment() {
    if (!currentAdjustResellerId) return;
    const resellerId = currentAdjustResellerId;
    const direction = document.getElementById('adjustDirection').value; // 'add' | 'subtract'
    const rawAmount = Number(document.getElementById('adjustAmount').value);
    const reason = (document.getElementById('adjustReason').value || '').trim();

    if (!rawAmount || rawAmount <= 0) {
      adminToast('সঠিক পরিমাণ লিখুন', 'error');
      return;
    }
    if (!reason) {
      adminToast('কারণ লিখুন', 'error');
      return;
    }

    const signedAmount = direction === 'subtract' ? -Math.abs(rawAmount) : Math.abs(rawAmount);
    const name = getResellerNameById(resellerId);

    const saveBtn = document.getElementById('walletAdjustSaveBtn');
    if (saveBtn) { saveBtn.disabled = true; saveBtn.style.opacity = '0.6'; }

    const walletRef = db.collection('resellerWallets').doc(resellerId);

    walletRef.get().then(walletSnap => {
      const currentBalance = walletSnap.exists ? Number(walletSnap.data().balance || 0) : 0;
      const balanceAfter = currentBalance + signedAmount;

      if (balanceAfter < 0) {
        throw { code: 'insufficient-balance' };
      }

      const ts = firebase.firestore.FieldValue.serverTimestamp();
      const batch = db.batch();

      // 1) Bump wallet balance (increment, never a raw .update of a literal value)
      // এডমিন bonus add করলে totalAdminBonus বাড়বে; subtract হলে শুধু balance কমবে
      const walletUpdate = { balance: firebase.firestore.FieldValue.increment(signedAmount), updatedAt: ts };
      if (signedAmount > 0) {
        walletUpdate.totalAdminBonus = firebase.firestore.FieldValue.increment(signedAmount);
      }
      batch.set(walletRef, walletUpdate, { merge: true });

      // 2) Record the adjustment transaction
      const txnRef = walletRef.collection('transactions').doc();
      batch.set(txnRef, {
        type: 'adjustment',
        amount: signedAmount,
        balanceAfter: balanceAfter,
        description: 'ম্যানুয়াল অ্যাডজাস্টমেন্ট: ' + reason,
        adjustedBy: (auth.currentUser && auth.currentUser.uid) || 'admin',
        createdAt: ts
      });

      // 3) Update lastTransactionAt explicitly so the wallet table reflects it immediately
      batch.set(walletRef, { lastTransactionAt: ts }, { merge: true });

      // 4) Notify the reseller
      const notifRef = db.collection('notifications').doc();
      batch.set(notifRef, {
        recipientId: resellerId,
        type: 'wallet_adjustment',
        title: signedAmount >= 0 ? 'ওয়ালেটে ব্যালেন্স যোগ হয়েছে' : 'ওয়ালেট থেকে ব্যালেন্স বিয়োগ হয়েছে',
        message: 'অ্যাডমিন কর্তৃক আপনার ওয়ালেটে ৳' + Math.abs(signedAmount).toLocaleString() + ' ' +
                 (signedAmount >= 0 ? 'যোগ' : 'বিয়োগ') + ' করা হয়েছে। কারণ: ' + reason,
        isRead: false,
        sentBy: 'admin',
        createdAt: ts
      });

      return batch.commit();
    })
    .then(() => {
      adminToast(`ওয়ালেট অ্যাডজাস্ট করা হয়েছে ✅ (${name})`);
      closeWalletAdjustModal();
    })
    .catch(err => {
      console.error('[wallets] adjustment failed', err);
      if (err && err.code === 'insufficient-balance') {
        adminToast('অপর্যাপ্ত ব্যালেন্স — এত পরিমাণ বিয়োগ করা যাবে না', 'error');
      } else {
        adminToast('অ্যাডজাস্টমেন্ট ব্যর্থ হয়েছে', 'error');
      }
    })
    .finally(() => {
      if (saveBtn) { saveBtn.disabled = false; saveBtn.style.opacity = '1'; }
    });
  }

  // =====================================================================
  // ===================== উইথড্রয়াল রিকুয়েস্ট (collectionGroup) ========
  // =====================================================================
  // Pending withdrawals — simple query, composite index লাগবে না
  let allPayoutRequests = [];
  let currentPayoutRejectRef = null;

  function listenPayoutRequests() {
    const body = document.getElementById('payoutTableBody');
    if (body) body.innerHTML = '<tr><td colspan="7" class="loading-wrap"><div class="spinner"></div></td></tr>';
    const warnBox = document.getElementById('payoutIndexWarning');
    if (warnBox) { warnBox.style.display = 'none'; warnBox.textContent = ''; }

    // শুধু withdrawalStatus == pending — একটিমাত্র where, orderBy নেই → composite index লাগবে না
    db.collectionGroup('transactions')
      .where('withdrawalStatus', '==', 'pending')
      .onSnapshot(snapshot => {
        allPayoutRequests = snapshot.docs.map(doc => ({
          id: doc.id,
          resellerId: doc.ref.parent.parent ? doc.ref.parent.parent.id : null,
          ref: doc.ref,
          ...doc.data()
        })).filter(t => t.resellerId);

        // client-side sort: নতুন আগে
        allPayoutRequests.sort((a, b) => {
          const ta = a.createdAt && a.createdAt.toMillis ? a.createdAt.toMillis() : 0;
          const tb = b.createdAt && b.createdAt.toMillis ? b.createdAt.toMillis() : 0;
          return tb - ta;
        });

        renderPayoutTable(allPayoutRequests);
        updatePayoutPendingBadge(allPayoutRequests.length);
        // history-ও refresh করি
        loadPayoutHistory();
      }, err => {
        console.warn('[payoutRequests] listener failed:', err);
        if (body) body.innerHTML = '<tr><td colspan="7" style="text-align:center;padding:30px;color:#94a3b8;">রিকুয়েস্ট লোড করা যায়নি</td></tr>';
        if (warnBox && err) {
          warnBox.style.display = 'block';
          if (err.code === 'permission-denied') {
            warnBox.innerHTML = '<strong><i class="fas fa-lock"></i> Permission Denied:</strong> Firestore Rules-এ collectionGroup("transactions") এর জন্য admin read permission দিন।';
          } else {
            warnBox.innerHTML = '<strong><i class="fas fa-exclamation-circle"></i> লোড ব্যর্থ:</strong> ' + escHTML(err.message || err.code || 'অজানা ত্রুটি');
          }
        }
      });
  }

  // ইতিহাস লোড (completed + rejected)
  function loadPayoutHistory() {
    const body      = document.getElementById('payoutHistoryBody');
    const countEl   = document.getElementById('payoutHistoryCount');
    if (!body) return;

    body.innerHTML = '<tr><td colspan="7" class="loading-wrap"><div class="spinner"></div></td></tr>';

    db.collectionGroup('transactions')
      .where('withdrawalStatus', 'in', ['completed', 'rejected'])
      .get()
      .then(snapshot => {
        const list = snapshot.docs.map(doc => ({
          id: doc.id,
          resellerId: doc.ref.parent.parent ? doc.ref.parent.parent.id : null,
          ref: doc.ref,
          ...doc.data()
        })).filter(t => t.resellerId);

        // client-side sort: নতুন আগে
        list.sort((a, b) => {
          const ta = a.processedAt && a.processedAt.toMillis ? a.processedAt.toMillis() : (a.createdAt && a.createdAt.toMillis ? a.createdAt.toMillis() : 0);
          const tb = b.processedAt && b.processedAt.toMillis ? b.processedAt.toMillis() : (b.createdAt && b.createdAt.toMillis ? b.createdAt.toMillis() : 0);
          return tb - ta;
        });

        if (countEl) countEl.textContent = list.length;

        if (!list.length) {
          body.innerHTML = '<tr><td colspan="7" style="text-align:center;padding:30px;color:#94a3b8;">কোনো ইতিহাস নেই</td></tr>';
          return;
        }

        body.innerHTML = list.map(t => {
          const name         = escHTML(getResellerNameById(t.resellerId));
          const amount       = Number(t.amount || 0);
          const payoutNumber = escHTML(t.payoutNumber || t.payoutAccount || '—');
          const methodBadge  = t.paymentMethod === 'bkash' ? '<span style="background:#e2136e;color:#fff;padding:2px 8px;border-radius:50px;font-size:0.72rem;font-weight:700;">bKash</span>' : t.paymentMethod === 'nagad' ? '<span style="background:#f6921e;color:#fff;padding:2px 8px;border-radius:50px;font-size:0.72rem;font-weight:700;">Nagad</span>' : '<span style="color:#94a3b8;">—</span>';
          const status       = (t.withdrawalStatus || '').toLowerCase();
          const statusBadge  = status === 'completed'
            ? '<span style="background:#d1fae5;color:#065f46;padding:3px 10px;border-radius:50px;font-size:0.74rem;font-weight:700;">✓ Approved</span>'
            : '<span style="background:#fee2e2;color:#991b1b;padding:3px 10px;border-radius:50px;font-size:0.74rem;font-weight:700;">✗ Rejected</span>';
          const reason       = t.rejectionReason ? `<div style="font-size:0.72rem;color:#94a3b8;margin-top:2px;">কারণ: ${escHTML(t.rejectionReason)}</div>` : '';
          const processedDate = escHTML(fmtTs(t.processedAt || t.createdAt));
          const rid  = escHTML(t.resellerId);
          const tid  = escHTML(t.id);
          return `<tr>
            <td><strong>${name}</strong></td>
            <td>${methodBadge}</td>
            <td style="font-family:monospace;">${payoutNumber}</td>
            <td style="font-weight:700;color:var(--secondary);">৳${amount.toLocaleString()}</td>
            <td>${statusBadge}${reason}</td>
            <td style="font-size:0.8rem;color:#64748b;">${processedDate}</td>
            <td>
              <button class="btn btn-danger btn-sm" onclick="deletePayoutHistory('${rid}','${tid}')" title="ডিলিট করুন">
                <i class="fas fa-trash"></i> ডিলিট
              </button>
            </td>
          </tr>`;
        }).join('');
      })
      .catch(err => {
        console.error('[payoutHistory] load failed', err);
        if (body) body.innerHTML = '<tr><td colspan="7" style="text-align:center;padding:24px;color:#ef4444;">লোড ব্যর্থ: ' + escHTML(err.message || '') + '</td></tr>';
      });
  }

  function deletePayoutHistory(resellerId, txnId) {
    if (!confirm('এই উইথড্রয়াল ইতিহাস রেকর্ডটি স্থায়ীভাবে ডিলিট করবেন?')) return;
    db.collection('resellerWallets').doc(resellerId)
      .collection('transactions').doc(txnId)
      .delete()
      .then(() => {
        adminToast('রেকর্ড ডিলিট হয়েছে');
        loadPayoutHistory();
      })
      .catch(err => {
        console.error('[deletePayoutHistory]', err);
        adminToast('ডিলিট ব্যর্থ: ' + (err.message || ''), 'error');
      });
  }

  function updatePayoutPendingBadge(count) {
    const badge = document.getElementById('payoutPendingBadge');
    if (!badge) return;
    if (count > 0) {
      badge.textContent = count;
      badge.style.display = 'inline-block';
    } else {
      badge.style.display = 'none';
    }
  }

  function renderPayoutTable(list) {
    const body = document.getElementById('payoutTableBody');
    if (!body) return;
    document.getElementById('payoutListCount').textContent = list.length;

    if (!list.length) {
      body.innerHTML = '<tr><td colspan="7" style="text-align:center;padding:40px;color:#94a3b8;">কোনো পেন্ডিং উইথড্রয়াল রিকুয়েস্ট নেই</td></tr>';
      return;
    }

    const table = document.getElementById('payoutTable');
    if (isMobile()) {
      if (table) table.classList.add('mobile-hide-table');
      let el = document.getElementById('payoutMobileCards');
      if (!el) { el = document.createElement('div'); el.id = 'payoutMobileCards'; table.parentNode.insertBefore(el, table); }
      el.className = 'mob-card-list';
      el.innerHTML = list.map(t => {
        const name = escHTML(getResellerNameById(t.resellerId));
        const amount = Number(t.amount || 0);
        const payoutNumber = escHTML(t.payoutNumber || t.payoutAccount || '—');
        const paymentMethod = escHTML(t.paymentMethod || '—');
        const methodBadge = t.paymentMethod === 'bkash' ? '<span style="background:#e2136e;color:#fff;padding:2px 8px;border-radius:50px;font-size:0.72rem;font-weight:700;">bKash</span>' : t.paymentMethod === 'nagad' ? '<span style="background:#f6921e;color:#fff;padding:2px 8px;border-radius:50px;font-size:0.72rem;font-weight:700;">Nagad</span>' : '<span style="color:#94a3b8;">—</span>';
        const created = escHTML(fmtTs(t.createdAt));
        return `<div class="mob-card">
          <div class="mob-card-header">
            <div class="mob-card-name">${name}</div>
            <span class="mob-price">৳${amount.toLocaleString()}</span>
          </div>
          <div class="mob-card-row"><span class="mob-card-label">পেমেন্ট মেথড</span><span class="mob-card-val">${methodBadge}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">পেআউট নাম্বার</span><span class="mob-card-val" style="font-family:monospace;">${payoutNumber}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">অনুরোধের তারিখ</span><span class="mob-card-val" style="font-size:0.8rem;color:#64748b;">${created}</span></div>
          <div class="mob-card-actions">
            <button class="btn btn-success btn-sm" onclick="approvePayoutRequest('${t.resellerId}','${t.id}')"><i class="fas fa-check"></i> Approve</button>
            <button class="btn btn-danger btn-sm" onclick="openPayoutRejectModal('${t.resellerId}','${t.id}')"><i class="fas fa-times"></i> Reject</button>
          </div>
        </div>`;
      }).join('');
    } else {
      if (table) table.classList.remove('mobile-hide-table');
      const old = document.getElementById('payoutMobileCards');
      if (old) old.remove();
      body.innerHTML = list.map(t => {
        const name = escHTML(getResellerNameById(t.resellerId));
        const amount = Number(t.amount || 0);
        const balanceAfter = Number(t.balanceAfter || 0);
        const payoutNumber = escHTML(t.payoutNumber || t.payoutAccount || '—');
        const methodBadge = t.paymentMethod === 'bkash' ? '<span style="background:#e2136e;color:#fff;padding:2px 8px;border-radius:50px;font-size:0.72rem;font-weight:700;">bKash</span>' : t.paymentMethod === 'nagad' ? '<span style="background:#f6921e;color:#fff;padding:2px 8px;border-radius:50px;font-size:0.72rem;font-weight:700;">Nagad</span>' : '<span style="color:#94a3b8;">—</span>';
        const created = escHTML(fmtTs(t.createdAt));
        return `
          <tr>
            <td><strong>${name}</strong></td>
            <td>${methodBadge}</td>
            <td style="font-family:monospace;">${payoutNumber}</td>
            <td style="font-weight:700;color:var(--secondary);">৳${amount.toLocaleString()}</td>
            <td style="color:#64748b;">৳${balanceAfter.toLocaleString()}</td>
            <td style="font-size:0.8rem;color:#64748b;">${created}</td>
            <td>
              <div class="actions-cell">
                <button class="btn btn-success btn-sm" onclick="approvePayoutRequest('${t.resellerId}','${t.id}')">
                  <i class="fas fa-check"></i> Approve
                </button>
                <button class="btn btn-danger btn-sm" onclick="openPayoutRejectModal('${t.resellerId}','${t.id}')">
                  <i class="fas fa-times"></i> Reject
                </button>
              </div>
            </td>
          </tr>`;
      }).join('');
    }
  }

  // ----- Approve: balance থেকে amount বিয়োগ, withdrawalStatus → completed -----
  function approvePayoutRequest(resellerId, txnId) {
    const txn = (allPayoutRequests || []).find(t => t.id === txnId && t.resellerId === resellerId);
    if (!txn) { adminToast('রিকুয়েস্ট পাওয়া যায়নি', 'error'); return; }
    const name = getResellerNameById(resellerId);
    const amount = Number(txn.amount || 0);

    confirmModal(`"${name}" এর ৳${amount.toLocaleString()} উইথড্রয়াল রিকুয়েস্ট Approve করতে চান? এই কাজটি পূর্বাবস্থায় ফেরানো যাবে না।`, () => {
      const walletRef = db.collection('resellerWallets').doc(resellerId);
      const txnRef = walletRef.collection('transactions').doc(txnId);

      txnRef.get().then(freshTxnSnap => {
        if (!freshTxnSnap.exists) throw { code: 'not-found' };
        const freshTxn = freshTxnSnap.data();
        if ((freshTxn.withdrawalStatus || '') !== 'pending') {
          throw { code: 'already-processed' };
        }
        const freshAmount = Number(freshTxn.amount || 0);

        return walletRef.get().then(walletSnap => {
          const currentBalance = walletSnap.exists ? Number(walletSnap.data().balance || 0) : 0;
          // balance ইতিমধ্যে request submit এর সময় কাটা হয়েছে।
          // approve এ শুধু totalWithdrawn বাড়ানো হচ্ছে, balance আর কাটা হচ্ছে না।
          const balanceAfter = currentBalance;
          const ts = firebase.firestore.FieldValue.serverTimestamp();
          const adminUid = (auth.currentUser && auth.currentUser.uid) || 'admin';

          const batch = db.batch();

          // 1) Mark the transaction completed + record the resulting balance
          batch.update(txnRef, {
            withdrawalStatus: 'completed',
            balanceAfter: balanceAfter,
            processedBy: adminUid,
            processedAt: ts
          });

          // 2) শুধু totalWithdrawn বাড়ানো হচ্ছে (balance request submit এ আগেই কাটা হয়েছে)
          batch.set(walletRef, {
            totalWithdrawn: firebase.firestore.FieldValue.increment(freshAmount),
            lastTransactionAt: ts,
            updatedAt: ts
          }, { merge: true });

          // 3) Notify the reseller
          const notifRef = db.collection('notifications').doc();
          batch.set(notifRef, {
            recipientId: resellerId,
            type: 'withdrawal_approved',
            title: 'উইথড্রয়াল সম্পন্ন হয়েছে',
            message: 'আপনার ৳' + freshAmount.toLocaleString() + ' উইথড্রয়াল রিকুয়েস্ট অ্যাপ্রুভ ও সম্পন্ন করা হয়েছে।',
            isRead: false,
            sentBy: 'admin',
            createdAt: ts
          });

          return batch.commit();
        });
      })
      .then(() => adminToast('উইথড্রয়াল Approve করা হয়েছে ✅'))
      .catch(err => {
        console.error('[payoutRequests] approve failed', err);
        if (err && err.code === 'already-processed') {
          adminToast('এই রিকুয়েস্ট ইতিমধ্যে প্রসেস করা হয়েছে', 'error');
        } else if (err && err.code === 'insufficient-balance') {
          adminToast('ওয়ালেটে অপর্যাপ্ত ব্যালেন্স — Approve করা যাচ্ছে না', 'error');
        } else {
          adminToast('Approve ব্যর্থ হয়েছে', 'error');
        }
      });
    });
  }

  // ----- Reject: withdrawalStatus → rejected, balance অপরিবর্তিত -----
  function openPayoutRejectModal(resellerId, txnId) {
    currentPayoutRejectRef = { resellerId, txnId };
    document.getElementById('payoutRejectReason').value = '';
    document.getElementById('payoutRejectModal').classList.add('open');
  }

  function closePayoutRejectModal() {
    document.getElementById('payoutRejectModal').classList.remove('open');
    currentPayoutRejectRef = null;
  }

  function submitPayoutReject() {
    if (!currentPayoutRejectRef) return;
    const { resellerId, txnId } = currentPayoutRejectRef;
    const reason = (document.getElementById('payoutRejectReason').value || '').trim();
    if (!reason) {
      adminToast('রিজেক্ট করার কারণ লিখুন', 'error');
      return;
    }

    const saveBtn = document.getElementById('payoutRejectSaveBtn');
    if (saveBtn) { saveBtn.disabled = true; saveBtn.style.opacity = '0.6'; }

    const walletRef = db.collection('resellerWallets').doc(resellerId);
    const txnRef = walletRef.collection('transactions').doc(txnId);

    txnRef.get().then(freshTxnSnap => {
      if (!freshTxnSnap.exists) throw { code: 'not-found' };
      const freshTxn = freshTxnSnap.data();
      if ((freshTxn.withdrawalStatus || '') !== 'pending') {
        throw { code: 'already-processed' };
      }
      const amount = Number(freshTxn.amount || 0);
      const ts = firebase.firestore.FieldValue.serverTimestamp();
      const adminUid = (auth.currentUser && auth.currentUser.uid) || 'admin';

      const batch = db.batch();

      // balance request submit এর সময় কাটা হয়েছিল,
      // তাই reject করলে সেই amount ফিরিয়ে দিতে হবে।
      batch.update(txnRef, {
        withdrawalStatus: 'rejected',
        rejectionReason: reason,
        processedBy: adminUid,
        processedAt: ts
      });

      // Balance refund করা হচ্ছে
      batch.set(walletRef, {
        balance:   firebase.firestore.FieldValue.increment(amount),
        updatedAt: ts
      }, { merge: true });

      const notifRef = db.collection('notifications').doc();
      batch.set(notifRef, {
        recipientId: resellerId,
        type: 'withdrawal_rejected',
        title: 'উইথড্রয়াল রিকুয়েস্ট রিজেক্ট হয়েছে',
        message: 'আপনার ৳' + amount.toLocaleString() + ' উইথড্রয়াল রিকুয়েস্ট রিজেক্ট করা হয়েছে। কারণ: ' + reason,
        isRead: false,
        sentBy: 'admin',
        createdAt: ts
      });

      return batch.commit();
    })
    .then(() => {
      adminToast('উইথড্রয়াল রিকুয়েস্ট রিজেক্ট করা হয়েছে ✅');
      closePayoutRejectModal();
    })
    .catch(err => {
      console.error('[payoutRequests] reject failed', err);
      if (err && err.code === 'already-processed') {
        adminToast('এই রিকুয়েস্ট ইতিমধ্যে প্রসেস করা হয়েছে', 'error');
      } else {
        adminToast('রিজেক্ট ব্যর্থ হয়েছে', 'error');
      }
    })
    .finally(() => {
      if (saveBtn) { saveBtn.disabled = false; saveBtn.style.opacity = '1'; }
    });
  }

  // ===================================================================
  // =================== রেফারেল বোনাস (referralBonusQueue) ===========
  // ===================================================================
  let referralBonusUnsubscribe = null;

  function listenReferralBonusQueue() {
    const pendingBody  = document.getElementById('referralBonusTableBody');
    const historyBody  = document.getElementById('referralBonusHistoryBody');
    const countEl      = document.getElementById('referralBonusCount');
    const badgeEl      = document.getElementById('referralBonusBadge');

    if (pendingBody) pendingBody.innerHTML = '<tr><td colspan="5" class="loading-wrap"><div class="spinner"></div></td></tr>';

    // Pending requests
    db.collection('referralBonusQueue')
      .where('status', '==', 'pending')
      .orderBy('createdAt', 'desc')
      .onSnapshot(snap => {
        const count = snap.size;
        if (countEl) countEl.textContent = count;
        if (badgeEl) {
          badgeEl.textContent = count;
          badgeEl.style.display = count > 0 ? 'inline-block' : 'none';
        }

        if (!pendingBody) return;
        if (snap.empty) {
          pendingBody.innerHTML = '<tr><td colspan="5" style="text-align:center;padding:30px;color:#94a3b8;"><i class="fas fa-check-circle" style="font-size:1.8rem;margin-bottom:10px;display:block;color:#d1fae5;"></i>কোনো পেন্ডিং রেফারেল বোনাস নেই</td></tr>';
          return;
        }

        pendingBody.innerHTML = snap.docs.map(doc => {
          const d = doc.data();
          const referrerName = getResellerNameById(d.referrerId) || d.referrerId.slice(0,8) + '…';
          const referredName = d.referredName || getResellerNameById(d.referredId) || d.referredId.slice(0,8) + '…';
          const date = d.createdAt ? fmtTs(d.createdAt) : '—';
          return `<tr>
            <td>
              <div style="font-weight:700;color:#1e293b;">${escHTML(referrerName)}</div>
              <div style="font-size:0.74rem;color:#94a3b8;">${escHTML(d.referrerId)}</div>
            </td>
            <td>
              <div style="font-weight:700;color:#1e293b;">${escHTML(referredName)}</div>
              <div style="font-size:0.74rem;color:#94a3b8;">${escHTML(d.referredId)}</div>
            </td>
            <td><span style="font-weight:800;color:#059669;">৳${Number(d.bonusAmount||50).toLocaleString()}</span> <span style="font-size:0.74rem;color:#94a3b8;">× ২ জন</span></td>
            <td style="font-size:0.8rem;color:#64748b;white-space:nowrap;">${escHTML(date)}</td>
            <td>
              <div style="display:flex;gap:6px;flex-wrap:wrap;">
                <button class="btn btn-sm" style="background:#10b981;color:#fff;border:none;" onclick="approveReferralBonus('${escHTML(doc.id)}', '${escHTML(d.referrerId)}', '${escHTML(d.referredId)}', ${Number(d.bonusAmount||50)}, '${escHTML(referredName)}')">
                  <i class="fas fa-check"></i> Approve
                </button>
                <button class="btn btn-sm btn-outline" style="color:#ef4444;border-color:#ef4444;" onclick="rejectReferralBonus('${escHTML(doc.id)}', '${escHTML(d.referrerId)}', '${escHTML(d.referredId)}')">
                  <i class="fas fa-xmark"></i> Reject
                </button>
              </div>
            </td>
          </tr>`;
        }).join('');
      }, err => {
        console.error('[referralBonus] listen error', err);
        if (pendingBody) pendingBody.innerHTML = '<tr><td colspan="5" style="text-align:center;padding:24px;color:#ef4444;">লোড করা যায়নি: ' + escHTML(err.message) + '</td></tr>';
      });

    // History (approved/rejected)
    db.collection('referralBonusQueue')
      .where('status', 'in', ['approved', 'rejected'])
      .orderBy('createdAt', 'desc')
      .limit(50)
      .get()
      .then(snap => {
        if (!historyBody) return;
        if (snap.empty) {
          historyBody.innerHTML = '<tr><td colspan="5" style="text-align:center;padding:24px;color:#94a3b8;">কোনো ইতিহাস নেই</td></tr>';
          return;
        }
        historyBody.innerHTML = snap.docs.map(doc => {
          const d = doc.data();
          const referrerName = getResellerNameById(d.referrerId) || d.referrerId.slice(0,8) + '…';
          const referredName = d.referredName || getResellerNameById(d.referredId) || d.referredId.slice(0,8) + '…';
          const statusBadge = d.status === 'approved'
            ? '<span style="background:#d1fae5;color:#065f46;padding:3px 10px;border-radius:50px;font-size:0.74rem;font-weight:700;">✓ Approved</span>'
            : '<span style="background:#fee2e2;color:#991b1b;padding:3px 10px;border-radius:50px;font-size:0.74rem;font-weight:700;">✗ Rejected</span>';
          return `<tr>
            <td style="font-weight:600;">${escHTML(referrerName)}</td>
            <td style="font-weight:600;">${escHTML(referredName)}</td>
            <td style="font-weight:700;color:#059669;">৳${Number(d.bonusAmount||50).toLocaleString()}</td>
            <td>${statusBadge}</td>
            <td style="font-size:0.8rem;color:#64748b;">${escHTML(fmtTs(d.createdAt))}</td>
          </tr>`;
        }).join('');
      })
      .catch(err => {
        console.error('[referralBonus] history error', err);
      });
  }

  function approveReferralBonus(queueId, referrerId, referredId, bonusAmount, referredName) {
    if (!confirm(`রেফারেল বোনাস Approve করবেন?\n\nরেফারকারী: ${getResellerNameById(referrerId)}\nরেফারড: ${referredName}\nপ্রত্যেকের ওয়ালেটে ৳${bonusAmount} যোগ হবে।`)) return;

    const ts    = firebase.firestore.FieldValue.serverTimestamp();
    const inc   = firebase.firestore.FieldValue.increment;
    const batch = db.batch();

    // রেফারকারীর wallet credit — totalReferralBonus আলাদা track হবে মোট আয়ের জন্য
    const refWallet = db.collection('resellerWallets').doc(referrerId);
    batch.set(refWallet, { balance: inc(bonusAmount), totalReferralBonus: inc(bonusAmount), updatedAt: ts }, { merge: true });

    // রেফারকারীর transaction record
    const refTx = refWallet.collection('transactions').doc();
    batch.set(refTx, {
      type: 'credit', amount: bonusAmount,
      description: 'রেফারেল বোনাস — ' + referredName,
      createdAt: ts, processedBy: 'admin'
    });

    // রেফারড ইউজারের wallet credit — totalReferralBonus আলাদা track হবে মোট আয়ের জন্য
    const memWallet = db.collection('resellerWallets').doc(referredId);
    batch.set(memWallet, { balance: inc(bonusAmount), totalReferralBonus: inc(bonusAmount), updatedAt: ts }, { merge: true });

    // রেফারড ইউজারের transaction record
    const memTx = memWallet.collection('transactions').doc();
    batch.set(memTx, {
      type: 'credit', amount: bonusAmount,
      description: 'রেফারেল যোগদান বোনাস — স্বাগতম!',
      createdAt: ts, processedBy: 'admin'
    });

    // Queue status → approved
    batch.update(db.collection('referralBonusQueue').doc(queueId), {
      status: 'approved', approvedAt: ts,
      approvedBy: (auth.currentUser && auth.currentUser.uid) || 'admin'
    });

    // রেফারড ইউজারের profile flag
    batch.update(db.collection('userProfiles').doc(referredId), {
      referralBonusPaid: true, referralBonusPaidAt: ts
    });

    // Notification — রেফারকারীকে
    batch.set(db.collection('notifications').doc(), {
      recipientId: referrerId, type: 'referral',
      title: 'রেফারেল বোনাস পেয়েছেন! 🎉',
      message: referredName + '-এর রেফারেল বোনাস হিসেবে আপনার ওয়ালেটে ৳' + bonusAmount + ' যোগ হয়েছে।',
      isRead: false, sentBy: 'admin', createdAt: ts
    });

    // Notification — রেফারড ইউজারকে
    batch.set(db.collection('notifications').doc(), {
      recipientId: referredId, type: 'referral',
      title: 'যোগদান বোনাস পেয়েছেন! 🎉',
      message: 'রেফারেল বোনাস হিসেবে আপনার ওয়ালেটে ৳' + bonusAmount + ' যোগ হয়েছে। ধন্যবাদ!',
      isRead: false, sentBy: 'admin', createdAt: ts
    });

    batch.commit()
      .then(() => adminToast('রেফারেল বোনাস Approve হয়েছে ✅ — উভয়ের ওয়ালেটে ৳' + bonusAmount + ' যোগ হয়েছে'))
      .catch(err => {
        console.error('[referralBonus] approve failed', err);
        adminToast('Approve ব্যর্থ হয়েছে: ' + err.message, 'error');
      });
  }

  function rejectReferralBonus(queueId, referrerId, referredId) {
    const reason = prompt('রিজেক্ট করার কারণ লিখুন:');
    if (reason === null) return; // cancelled
    if (!reason.trim()) { adminToast('কারণ লিখুন', 'error'); return; }

    const ts    = firebase.firestore.FieldValue.serverTimestamp();
    const batch = db.batch();

    batch.update(db.collection('referralBonusQueue').doc(queueId), {
      status: 'rejected', rejectedAt: ts, rejectReason: reason.trim(),
      rejectedBy: (auth.currentUser && auth.currentUser.uid) || 'admin'
    });

    // referredId-এর queued flag সরিয়ে দিই যাতে পরে retry হতে পারে
    batch.update(db.collection('userProfiles').doc(referredId), {
      referralBonusQueued: false
    });

    batch.commit()
      .then(() => adminToast('রেফারেল বোনাস Reject করা হয়েছে'))
      .catch(err => {
        console.error('[referralBonus] reject failed', err);
        adminToast('Reject ব্যর্থ হয়েছে', 'error');
      });
  }

  // ===== ADD NEW RESELLER (admin-created, auto-approved) =====
  function openAddResellerModal() {
    // Reset fields each time the modal opens.
    ['newResellerName','newResellerEmail','newResellerPhone','newResellerAddress',
     'newResellerBkash','newResellerNagad'].forEach(id => {
      const el = document.getElementById(id);
      if (el) el.value = '';
    });
    const tier = document.getElementById('newResellerTier');
    if (tier) tier.value = 'bronze';
    const warn = document.getElementById('newResellerWarning');
    if (warn) { warn.style.display = 'none'; warn.textContent = ''; }
    document.getElementById('addResellerModal').classList.add('open');
  }

  function closeAddResellerModal() {
    document.getElementById('addResellerModal').classList.remove('open');
  }

  function showNewResellerWarning(msg) {
    const warn = document.getElementById('newResellerWarning');
    if (!warn) return;
    warn.textContent = msg;
    warn.style.display = 'block';
  }

  function isValidEmailFormat(email) {
    return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
  }

  function submitNewReseller() {
    const fullName = (document.getElementById('newResellerName').value || '').trim();
    const email    = (document.getElementById('newResellerEmail').value || '').trim().toLowerCase();
    const phone    = (document.getElementById('newResellerPhone').value || '').trim();
    const address  = (document.getElementById('newResellerAddress').value || '').trim();
    const tier     = (document.getElementById('newResellerTier').value || 'bronze').trim();
    const bkash    = (document.getElementById('newResellerBkash').value || '').trim();
    const nagad    = (document.getElementById('newResellerNagad').value || '').trim();

    // ---- Validation ----
    if (!fullName) {
      showNewResellerWarning('পুরো নাম অবশ্যই দিতে হবে।');
      adminToast('নাম দিন', 'error');
      return;
    }
    if (!email) {
      showNewResellerWarning('ইমেইল অবশ্যই দিতে হবে।');
      adminToast('ইমেইল দিন', 'error');
      return;
    }
    if (!isValidEmailFormat(email)) {
      showNewResellerWarning('ইমেইল ফরম্যাট সঠিক নয়।');
      adminToast('ইমেইল ফরম্যাট ঠিক নেই', 'error');
      return;
    }

    // Duplicate email check against the in-memory reseller list
    const duplicate = (allResellers || []).find(r =>
      (r.email || '').trim().toLowerCase() === email
    );
    if (duplicate) {
      showNewResellerWarning('সতর্কতা: এই ইমেইল দিয়ে ইতিমধ্যে একজন রিসেলার আছেন (' +
        (duplicate.fullName || duplicate.displayName || duplicate.name || duplicate.id) + ')।');
      adminToast('ডুপ্লিকেট ইমেইল', 'error');
      return;
    }

    const saveBtn = document.getElementById('newResellerSaveBtn');
    if (saveBtn) { saveBtn.disabled = true; saveBtn.style.opacity = '0.6'; }

    const ts = firebase.firestore.FieldValue.serverTimestamp();

    // Auto-generated doc id (no Firebase Auth UID yet).
    const userRef   = db.collection('userProfiles').doc();
    const walletRef = db.collection('resellerWallets').doc(userRef.id);

    const paymentMethods = {};
    if (bkash) paymentMethods.bkash = bkash;
    if (nagad) paymentMethods.nagad = nagad;

    const userData = {
      role: 'reseller',
      approvalStatus: 'approved',
      fullName: fullName,
      displayName: fullName,
      email: email,
      phone: phone,
      address: address,
      tier: tier,
      paymentMethods: paymentMethods,
      createdAt: ts,
      approvedAt: ts,
      approvalUpdatedAt: ts,
      createdByAdmin: true
    };

    const walletData = {
      balance: 0,
      totalEarned: 0,
      totalWithdrawn: 0,
      pendingCommission: 0,
      minimumWithdrawal: 200,
      status: 'active',
      createdAt: ts,
      updatedAt: ts
    };

    const batch = db.batch();
    batch.set(userRef, userData);
    batch.set(walletRef, walletData);

    batch.commit()
      .then(() => {
        adminToast('নতুন রিসেলার সফলভাবে যোগ হয়েছে ✅', 'success');
        closeAddResellerModal();
        // The onSnapshot listener on `users` will auto-refresh the table,
        // but call filter explicitly so any active search/filter re-applies.
        if (typeof filterResellerTable === 'function') filterResellerTable();
      })
      .catch(err => {
        console.error('[resellers] add failed', err);
        showNewResellerWarning('সংরক্ষণ ব্যর্থ: ' + (err.message || err));
        adminToast('সংরক্ষণ ব্যর্থ', 'error');
      })
      .finally(() => {
        if (saveBtn) { saveBtn.disabled = false; saveBtn.style.opacity = ''; }
      });
  }

  // Wire reseller search box once DOM is ready.
  document.addEventListener('DOMContentLoaded', () => {
    const rs = document.getElementById('resellerSearch');
    if (rs) rs.addEventListener('input', () => filterResellerTable());
  });

  // ===== LOAD DASHBOARD =====
  function loadDashboard() {
    // Stats loaded via listeners
  }

  // ===== PRODUCT TABLE =====
  const catNames = { smartphone:'স্মার্টফোন', earphone:'ইয়ারফোন', smartwatch:'স্মার্টওয়াচ', laptop:'ল্যাপটপ', gaming:'গেমিং', camera:'ক্যামেরা', charger:'চার্জার', tablet:'ট্যাবলেট', accessories:'অ্যাক্সেসরিজ', onyo:'অনন্য', other:'অন্যান্য' };

  function renderProductTable(products) {
    const body = document.getElementById('productTableBody');
    document.getElementById('productListCount').textContent = products.length;
    const start = (currentPage - 1) * PAGE_SIZE;
    const page = products.slice(start, start + PAGE_SIZE);

    if (!page.length) {
      body.innerHTML = '<tr><td colspan="8" style="text-align:center;padding:40px;color:#94a3b8;">কোনো পণ্য নেই</td></tr>';
      renderPagination(products.length);
      return;
    }

    const table = document.getElementById('productTable');
    if (isMobile()) {
      if (table) table.classList.add('mobile-hide-table');
      let el = document.getElementById('productMobileCards');
      if (!el) { el = document.createElement('div'); el.id = 'productMobileCards'; table.parentNode.insertBefore(el, table); }
      el.className = 'mob-card-list';
      el.innerHTML = page.map(p => {
        const thumbHtml = p.thumbnail
          ? `<img src="${optimizeCloudinaryUrl(p.thumbnail)}" style="width:52px;height:52px;border-radius:10px;object-fit:cover;flex-shrink:0;" onerror="this.style.display='none'" />`
          : `<div style="width:52px;height:52px;border-radius:10px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;color:#94a3b8;flex-shrink:0;font-size:1.3rem;"><i class="fas fa-box"></i></div>`;
        return `<div class="mob-card">
          <div class="mob-card-header">
            <div style="display:flex;align-items:center;gap:10px;min-width:0;">
              ${thumbHtml}
              <div style="min-width:0;">
                <div class="mob-card-title">${p.title || '—'}</div>
                <div class="mob-card-sub">${catNames[p.category] || p.category || '—'} ${p.featured ? '⭐' : p.hot ? '🔥' : ''}</div>
              </div>
            </div>
            <span class="badge-status ${p.status === 'inactive' ? 'badge-inactive' : 'badge-active'}" style="flex-shrink:0;">${p.status === 'inactive' ? 'নিষ্ক্রিয়' : 'সক্রিয়'}</span>
          </div>
          <div class="mob-card-row"><span class="mob-card-label">মূল্য</span><span class="mob-price">৳${Number(p.price||0).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">স্টক</span><span class="mob-card-val">${p.stock || '—'}</span></div>
          <div class="mob-card-actions">
            <button class="btn btn-warning btn-sm" onclick="openEditProductModal('${p.id}')"><i class="fas fa-edit"></i> এডিট</button>
            <button class="btn btn-outline btn-sm" onclick="toggleProductStatus('${p.id}', '${p.status || 'active'}')">${p.status === 'inactive' ? '<i class="fas fa-eye"></i> দেখান' : '<i class="fas fa-eye-slash"></i> লুকান'}</button>
            <button class="btn btn-danger btn-sm" onclick="openDeleteModal('${p.id}', '${(p.title||'').replace(/'/g, '&apos;')}')"><i class="fas fa-trash"></i></button>
          </div>
        </div>`;
      }).join('');
    } else {
      if (table) table.classList.remove('mobile-hide-table');
      const old = document.getElementById('productMobileCards');
      if (old) old.remove();
      body.innerHTML = page.map(p => `
        <tr>
          <td>
            ${p.thumbnail ? `<img src="${optimizeCloudinaryUrl(p.thumbnail)}" class="product-thumb" alt="${p.title}" onerror="this.style.display='none';this.nextElementSibling.style.display='flex'"><div class="product-thumb-placeholder" style="display:none;"><i class="fas fa-box"></i></div>` : `<div class="product-thumb-placeholder"><i class="fas fa-box"></i></div>`}
          </td>
          <td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;">${p.title || '—'}</td>
          <td>${catNames[p.category] || p.category || '—'}</td>
          <td style="font-weight:700;color:var(--primary);">৳${Number(p.price || 0).toLocaleString()}</td>
          <td>${p.stock || '—'}</td>
          <td><span class="badge-status ${p.status === 'inactive' ? 'badge-inactive' : 'badge-active'}">${p.status === 'inactive' ? 'নিষ্ক্রিয়' : 'সক্রিয়'}</span></td>
          <td style="text-align:center;">${p.featured ? '⭐' : p.hot ? '🔥' : '—'}</td>
          <td>
            <div class="actions-cell">
              <button class="btn btn-warning btn-sm" onclick="openEditProductModal('${p.id}')"><i class="fas fa-edit"></i></button>
              <button class="btn btn-outline btn-sm" onclick="toggleProductStatus('${p.id}', '${p.status || 'active'}')">
                ${p.status === 'inactive' ? '<i class="fas fa-eye"></i>' : '<i class="fas fa-eye-slash"></i>'}
              </button>
              <button class="btn btn-danger btn-sm" onclick="openDeleteModal('${p.id}', '${(p.title||'').replace(/'/g, '&apos;')}')"><i class="fas fa-trash"></i></button>
            </div>
          </td>
        </tr>
      `).join('');
    }

    renderPagination(products.length);
  }

  function renderPagination(total) {
    const pages = Math.ceil(total / PAGE_SIZE);
    const container = document.getElementById('productPagination');
    if (pages <= 1) { container.innerHTML = ''; return; }
    let html = '';
    for (let i = 1; i <= pages; i++) {
      html += `<div class="page-btn ${i === currentPage ? 'active' : ''}" onclick="goToPage(${i})">${i}</div>`;
    }
    container.innerHTML = html;
  }

  function goToPage(p) {
    currentPage = p;
    renderProductTable(filteredProducts);
  }

  function filterProductTable(query) {
    const q = (typeof query === 'string' ? query : document.getElementById('productSearch').value).toLowerCase();
    const cat = document.getElementById('productCatFilter').value;
    filteredProducts = allProducts.filter(p => {
      const matchQ = !q || (p.title||'').toLowerCase().includes(q) || (p.brand||'').toLowerCase().includes(q);
      const matchCat = !cat || p.category === cat;
      return matchQ && matchCat;
    });
    currentPage = 1;
    renderProductTable(filteredProducts);
  }

  // ===== TOGGLE PRODUCT STATUS =====
  function toggleProductStatus(id, currentStatus) {
    const newStatus = currentStatus === 'inactive' ? 'active' : 'inactive';
    db.collection('products').doc(id).update({ status: newStatus })
      .then(() => adminToast(newStatus === 'active' ? 'পণ্য সক্রিয় করা হয়েছে ✅' : 'পণ্য নিষ্ক্রিয় করা হয়েছে'))
      .catch(() => adminToast('আপডেট ব্যর্থ', 'error'));
  }

  // ===== ORDER TABLE =====
  function renderOrderTable(orders) {
    const body = document.getElementById('orderTableBody');
    const table = document.getElementById('orderTable');
    if (!orders.length) {
      if (table) table.classList.remove('mobile-hide-table');
      body.innerHTML = '<tr><td colspan="8" style="text-align:center;padding:40px;color:#94a3b8;">কোনো অর্ডার নেই</td></tr>';
      const old = document.getElementById('orderMobileCards');
      if (old) old.remove();
      return;
    }
    const statusClass = { pending:'order-pending', confirmed:'order-confirmed', shipped:'order-shipped', delivered:'order-delivered', cancelled:'order-cancelled' };
    const statusLabel = { pending:'পেন্ডিং', confirmed:'কনফার্মড', shipped:'শিপড', delivered:'ডেলিভারড', cancelled:'বাতিল' };
    const payLabel = { cod:'ক্যাশ অন ডেলিভারি', bkash:'bKash', nagad:'Nagad' };

    if (isMobile()) {
      if (table) table.classList.add('mobile-hide-table');
      let el = document.getElementById('orderMobileCards');
      if (!el) { el = document.createElement('div'); el.id = 'orderMobileCards'; table.parentNode.insertBefore(el, table); }
      el.className = 'mob-card-list';
      el.innerHTML = orders.map(o => {
        const phone = o.phone || o.customerPhone || '';
        const productTitle = o.productTitle || (o.products && o.products[0] && o.products[0].title) || '—';
        const total = o.grandTotal || o.total || 0;
        const date = o.createdAt ? new Date(o.createdAt.toDate()).toLocaleDateString('bn-BD') : '—';
        return `<div class="mob-card">
          <div class="mob-card-header">
            <div>
              <div class="mob-card-name">${o.customerName || '—'}</div>
              <div class="mob-card-sub">${phone}</div>
            </div>
            <span class="order-status ${statusClass[o.status] || 'order-pending'}">${statusLabel[o.status] || 'পেন্ডিং'}</span>
          </div>
          <div class="mob-card-row"><span class="mob-card-label">অর্ডার আইডি</span><span class="mob-card-id">${formatOrderId(o.id)}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">পণ্য</span><span class="mob-card-val" style="max-width:55vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">${productTitle}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">মোট</span><span class="mob-price">৳${Number(total).toLocaleString()}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">পেমেন্ট</span><span class="mob-card-val">${payLabel[o.paymentMethod] || o.paymentMethod || '—'}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">তারিখ</span><span class="mob-card-val">${date}</span></div>
          <div class="mob-card-actions">
            <button class="btn btn-primary btn-sm" onclick="openOrderModal('${o.id}')"><i class="fas fa-eye"></i> বিবরণ</button>
            <button class="btn btn-danger btn-sm" onclick="deleteOrder('${o.id}')"><i class="fas fa-trash"></i> ডিলিট</button>
          </div>
        </div>`;
      }).join('');
    } else {
      if (table) table.classList.remove('mobile-hide-table');
      const old = document.getElementById('orderMobileCards');
      if (old) old.remove();
      body.innerHTML = orders.map(o => {
        const phone = o.phone || o.customerPhone || '';
        const productTitle = o.productTitle || (o.products && o.products[0] && o.products[0].title) || '—';
        const total = o.grandTotal || o.total || 0;
        return `
        <tr>
          <td style="font-family:monospace;font-size:0.8rem;">${formatOrderId(o.id)}</td>
          <td>
            <div style="font-weight:600;">${o.customerName || '—'}</div>
            <div style="font-size:0.78rem;color:#64748b;">${phone}</div>
          </td>
          <td style="max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">${productTitle}</td>
          <td style="font-weight:700;color:var(--primary);">৳${Number(total).toLocaleString()}</td>
          <td>${payLabel[o.paymentMethod] || o.paymentMethod || '—'}</td>
          <td><span class="order-status ${statusClass[o.status] || 'order-pending'}">${statusLabel[o.status] || o.status || 'পেন্ডিং'}</span></td>
          <td style="font-size:0.8rem;color:#64748b;">${o.createdAt ? new Date(o.createdAt.toDate()).toLocaleDateString('bn-BD') : '—'}</td>
          <td><button class="btn btn-primary btn-sm" onclick="openOrderModal('${o.id}')" title="দেখুন"><i class="fas fa-eye"></i></button> <button class="btn btn-danger btn-sm" onclick="deleteOrder('${o.id}')" title="ডিলিট" style="margin-left:6px;"><i class="fas fa-trash"></i></button></td>
        </tr>
      `}).join('');
    }
  }

  function filterOrderTable() {
    const status    = document.getElementById('orderStatusFilter').value;
    const searchEl  = document.getElementById('orderSearch');
    const rawSearch = (searchEl ? searchEl.value : '').trim();
    /* # দিলেও কাজ করবে */
    const search    = rawSearch.replace(/^#/, '').toLowerCase();
    let filtered = status ? allOrders.filter(o => o.status === status) : allOrders.slice();
    if (search) {
      filtered = filtered.filter(o => {
        /* user যে ID দেখছে সেটার শেষ ৮ অক্ষর */
        const shownId      = String(o.id || '').slice(-8).toLowerCase();
        const fullId       = String(o.id || '').toLowerCase();
        const custName     = String(o.customerName || '').toLowerCase();
        const phone        = String(o.phone || o.customerPhone || '').toLowerCase();
        const address      = String(o.address || o.customerAddress || '').toLowerCase();
        const district     = String(o.district || '').toLowerCase();
        const productTitle = (
          o.productTitle ||
          (o.products && o.products[0] && o.products[0].title) || ''
        ).toLowerCase();
        return shownId.includes(search)
            || fullId.includes(search)
            || custName.includes(search)
            || phone.includes(search)
            || address.includes(search)
            || district.includes(search)
            || productTitle.includes(search);
      });
    }
    document.getElementById('orderListCount').textContent = filtered.length;
    renderOrderTable(filtered);
  }

  function deleteOrder(id) {
    if (!id) return;
    const shortId = String(id).slice(-8).toUpperCase();
    if (!confirm('আপনি কি নিশ্চিত যে অর্ডার ' + formatOrderId(id) + ' মুছে ফেলতে চান? এই কাজটি পূর্বাবস্থায় ফেরানো যাবে না।')) return;
    db.collection('orders').doc(id).delete()
      .then(() => {
        adminToast('অর্ডার মুছে ফেলা হয়েছে ✅');
        // Update local cache immediately for snappy UX (listener will also refresh)
        allOrders = allOrders.filter(o => o.id !== id);
        filterOrderTable();
      })
      .catch((err) => {
        console.error('Order delete failed:', err);
        adminToast('ডিলিট ব্যর্থ', 'error');
      });
  }

  function renderRecentOrders(orders) {
    const container = document.getElementById('recentOrdersTable');
    if (!orders.length) { container.innerHTML = '<p style="text-align:center;color:#94a3b8;padding:20px;">কোনো অর্ডার নেই</p>'; return; }
    const statusLabel = { pending:'পেন্ডিং', confirmed:'কনফার্মড', shipped:'শিপড', delivered:'ডেলিভারড', cancelled:'বাতিল' };
    const statusClass = { pending:'order-pending', confirmed:'order-confirmed', shipped:'order-shipped', delivered:'order-delivered', cancelled:'order-cancelled' };
    if (isMobile()) {
      container.innerHTML = '<div class="mob-card-list" style="padding:8px 0;">' + orders.map(o => {
        const productTitle = o.productTitle || (o.products && o.products[0] && o.products[0].title) || '—';
        const total = o.grandTotal || o.total || 0;
        return `<div class="mob-card" onclick="openOrderModal('${o.id}')" style="cursor:pointer;">
          <div class="mob-card-header">
            <div><div class="mob-card-name">${o.customerName || '—'}</div><div class="mob-card-sub">${productTitle}</div></div>
            <span class="order-status ${statusClass[o.status] || 'order-pending'}">${statusLabel[o.status] || 'পেন্ডিং'}</span>
          </div>
          <div class="mob-card-row"><span class="mob-card-label">আইডি</span><span class="mob-card-id">${formatOrderId(o.id)}</span></div>
          <div class="mob-card-row"><span class="mob-card-label">মোট</span><span class="mob-price">৳${Number(total).toLocaleString()}</span></div>
        </div>`;
      }).join('') + '</div>';
      return;
    }
    container.innerHTML = `<table class="product-table"><thead><tr><th>আইডি</th><th>গ্রাহক</th><th>পণ্য</th><th>মোট</th><th>স্ট্যাটাস</th></tr></thead><tbody>${
      orders.map(o => {
        const productTitle = o.productTitle || (o.products && o.products[0] && o.products[0].title) || '—';
        const total = o.grandTotal || o.total || 0;
        return `<tr>
        <td style="font-family:monospace;font-size:0.78rem;">${formatOrderId(o.id)}</td>
        <td>${o.customerName || '—'}</td>
        <td style="max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">${productTitle}</td>
        <td style="font-weight:700;color:var(--primary);">৳${Number(total).toLocaleString()}</td>
        <td><span class="order-status ${statusClass[o.status] || 'order-pending'}">${statusLabel[o.status] || 'পেন্ডিং'}</span></td>
      </tr>`;}).join('')
    }</tbody></table>`;
  }

  // ===== ORDER MODAL =====
  function openOrderModal(id) {
    const order = allOrders.find(o => o.id === id);
    if (!order) return;
    currentOrderId = id;
    document.getElementById('orderStatusSelect').value = order.status || 'pending';
    const labelEl = document.getElementById('orderModalIdLabel');
    if (labelEl) labelEl.textContent = formatOrderId(id);
    const payLabel = { cod:'ক্যাশ অন ডেলিভারি', bkash:'bKash', nagad:'Nagad' };

    // Resolve fields supporting both old and new order formats
    const phone = order.phone || order.customerPhone || '—';
    const address = order.address || order.customerAddress || '—';
    const deliveryZone = order.deliveryZone || '';
    const total = order.grandTotal || order.total || 0;
    const subtotal = order.subtotal || 0;
    const note = order.note || '';
    const district = order.district || order.customerDistrict || '';
    const topLevelColor = order.color || order.selectedColor || '';

    // Products: support both products[] array (new) and flat productTitle (old)
    let productsHtml = '';
    if (order.products && order.products.length) {
      productsHtml = order.products.map(p => `
        <div style="display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #f1f5f9;">
          ${p.thumbnail ? `<img src="${optimizeCloudinaryUrl(p.thumbnail)}" style="width:40px;height:40px;border-radius:6px;object-fit:cover;" onerror="this.style.display='none'" />` : ''}
          <div style="flex:1;">
            <div style="font-weight:600;font-size:0.88rem;">${p.title || '—'}</div>
            <div style="font-size:0.78rem;color:#64748b;">
              পরিমাণ: ${(p.quantity != null ? p.quantity : p.qty != null ? p.qty : p.count != null ? p.count : order.quantity != null ? order.quantity : 1)}টি
              ${p.color ? ' | রঙ: ' + p.color : ''}
              ${p.size ? ' | সাইজ: ' + p.size : ''}
            </div>
          </div>
          <div style="font-weight:700;color:var(--primary);font-size:0.88rem;">৳${Number(p.price || p.total || 0).toLocaleString()}</div>
        </div>
      `).join('');
    } else {
      // Old flat format fallback
      const title = order.productTitle || '—';
      productsHtml = `
        <div style="padding:8px 0;">
          <div style="font-weight:600;">${title}</div>
          <div style="font-size:0.8rem;color:#94a3b8;">পরিমাণ: ${(order.quantity != null ? order.quantity : order.qty != null ? order.qty : order.count != null ? order.count : 1)}টি ${order.color ? '| রঙ: '+order.color : ''}</div>
        </div>`;
    }

    document.getElementById('orderModalBody').innerHTML = `
      <div style="display:grid;gap:10px;">
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">গ্রাহকের নাম</div>
            <div style="font-weight:700;">${order.customerName || '—'}</div>
          </div>
          <div style="background:#f8fafc;border-radius:8px;padding:14px;">
            <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">ফোন</div>
            <div style="font-weight:700;">${phone}</div>
          </div>
        </div>
        <div style="background:#f8fafc;border-radius:8px;padding:14px;">
          <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">ডেলিভারি ঠিকানা${deliveryZone ? ' — ' + deliveryZone : ''}</div>
          ${district ? `<div style="font-size:0.82rem;color:#374151;margin-bottom:4px;"><i class="fas fa-map-marker-alt" style="color:#ef4444;margin-right:4px;"></i><span style="color:#64748b;">জেলা:</span> <strong>${district}</strong></div>` : ''}
          <div style="font-weight:600;">${address}</div>
        </div>
        <div style="background:#f8fafc;border-radius:8px;padding:14px;">
          <div style="font-size:0.75rem;color:#64748b;margin-bottom:8px;">পণ্য তালিকা${topLevelColor ? ` <span style="background:#ede9fe;color:#6c63ff;font-weight:700;padding:2px 10px;border-radius:50px;margin-left:6px;font-size:0.78rem;">🎨 রঙ: ${topLevelColor}</span>` : ''}</div>
          ${productsHtml}
        </div>
        <div style="background:#f8fafc;border-radius:8px;padding:14px;">
          <div style="font-size:0.75rem;color:#64748b;margin-bottom:4px;">মূল্য বিবরণ</div>
          ${subtotal ? `<div style="font-size:0.85rem;">পণ্য মূল্য: ৳${Number(subtotal).toLocaleString()}</div>` : ''}
          <div style="font-size:0.85rem;display:flex;align-items:center;gap:6px;">
            ডেলিভারি চার্জ: ৳${Number(order.deliveryCharge||0).toLocaleString()}
            ${(order.paymentMethod === 'bkash' || order.paymentMethod === 'nagad' || (order.paymentMethod === 'cod' && (order.codAdvanceTrx || order.codAdvanceSender))) && order.deliveryCharge > 0
              ? `<span style="background:#d1fae5;color:#065f46;font-size:0.72rem;font-weight:700;padding:2px 8px;border-radius:50px;">পরিশোধিত</span>`
              : ''}
          </div>
          <div style="font-weight:700;color:var(--primary);margin-top:4px;font-size:1rem;">মোট: ৳${Number(total).toLocaleString()}</div>
        </div>
        <div style="background:#f8fafc;border-radius:8px;padding:14px;">
          <div style="font-size:0.75rem;color:#64748b;margin-bottom:8px;">পেমেন্ট পদ্ধতি</div>
          ${(() => {
            const pm = order.paymentMethod;
            if (pm === 'bkash') {
              return `
                <div style="display:flex;align-items:center;gap:8px;margin-bottom:10px;">
                  <span style="background:#fdf2f8;color:#e2136e;font-weight:700;font-size:0.95rem;padding:5px 14px;border-radius:50px;border:1.5px solid #f0abfc;">
                    <i class="fas fa-mobile-alt" style="margin-right:5px;"></i>bKash
                  </span>
                </div>
                ${order.trxSender ? `<div style="font-size:0.82rem;color:#374151;margin-bottom:4px;"><span style="color:#64748b;">bKash নম্বর:</span> <strong>${order.trxSender}</strong></div>` : ''}
                ${order.trxId ? `<div style="font-size:0.82rem;color:#374151;"><span style="color:#64748b;">TrxID:</span> <strong style="font-family:monospace;">${order.trxId}</strong></div>` : ''}`;
            } else if (pm === 'nagad') {
              return `
                <div style="display:flex;align-items:center;gap:8px;margin-bottom:10px;">
                  <span style="background:#fff7ed;color:#f97316;font-weight:700;font-size:0.95rem;padding:5px 14px;border-radius:50px;border:1.5px solid #fed7aa;">
                    <i class="fas fa-wallet" style="margin-right:5px;"></i>Nagad
                  </span>
                </div>
                ${order.trxSender ? `<div style="font-size:0.82rem;color:#374151;margin-bottom:4px;"><span style="color:#64748b;">Nagad নম্বর:</span> <strong>${order.trxSender}</strong></div>` : ''}
                ${order.trxId ? `<div style="font-size:0.82rem;color:#374151;"><span style="color:#64748b;">TrxID:</span> <strong style="font-family:monospace;">${order.trxId}</strong></div>` : ''}`;
            } else {
              // Cash on Delivery
              const codMethod = order.codAdvanceMethod;
              const codSender = order.codAdvanceSender;
              const codTrx    = order.codAdvanceTrx;
              const codAmt    = order.codAdvanceAmount || order.deliveryCharge || 0;
              const zoneLabel = order.deliveryZoneName || (order.deliveryZone === 'outside' ? 'বাইরের জোন' : 'ভিতরের জোন');
              let codHtml = `
                <div style="display:flex;align-items:center;gap:8px;margin-bottom:10px;">
                  <span style="background:#fffbeb;color:#92400e;font-weight:700;font-size:0.95rem;padding:5px 14px;border-radius:50px;border:1.5px solid #fde68a;">
                    <i class="fas fa-money-bill-wave" style="margin-right:5px;"></i>ক্যাশ অন ডেলিভারি
                  </span>
                </div>`;
              if (codAmt > 0 && (codSender || codTrx)) {
                const methodLabel = codMethod === 'nagad' ? 'Nagad' : 'bKash';
                const methodColor = codMethod === 'nagad' ? '#f97316' : '#e2136e';
                codHtml += `
                  <div style="background:#fff8f0;border:1px solid #fbbf24;border-radius:8px;padding:10px;margin-top:6px;">
                    <div style="font-size:0.78rem;font-weight:700;color:#92400e;margin-bottom:6px;">
                      <i class="fas fa-truck" style="margin-right:4px;"></i>অগ্রিম ডেলিভারি চার্জ পরিশোধ
                    </div>
                    <div style="font-size:0.82rem;color:#374151;margin-bottom:3px;">
                      <span style="color:#64748b;">এলাকা:</span> <strong>${zoneLabel}</strong>
                      &nbsp;|&nbsp; <span style="color:#64748b;">পরিমাণ:</span> <strong>৳${Number(codAmt).toLocaleString()}</strong>
                    </div>
                    <div style="font-size:0.82rem;color:#374151;margin-bottom:3px;">
                      <span style="color:#64748b;">মাধ্যম:</span>
                      <strong style="color:${methodColor};">${methodLabel}</strong>
                    </div>
                    ${codSender ? `<div style="font-size:0.82rem;color:#374151;margin-bottom:3px;"><span style="color:#64748b;">${methodLabel} নম্বর:</span> <strong>${codSender}</strong></div>` : ''}
                    ${codTrx ? `<div style="font-size:0.82rem;color:#374151;"><span style="color:#64748b;">TrxID:</span> <strong style="font-family:monospace;">${codTrx}</strong></div>` : ''}
                  </div>`;
              } else if (codAmt === 0) {
                codHtml += `<div style="font-size:0.82rem;color:#10b981;margin-top:4px;"><i class="fas fa-check-circle" style="margin-right:4px;"></i>ফ্রি ডেলিভারি — অগ্রিম চার্জ প্রযোজ্য নয়</div>`;
              }
              return codHtml;
            }
          })()}
        </div>
        ${note ? `<div style="background:#fffbeb;border:1px solid #fde68a;border-radius:8px;padding:12px;font-size:0.85rem;"><strong>নোট:</strong> ${note}</div>` : ''}
      </div>`;
    document.getElementById('orderModal').classList.add('open');
  }

  function closeOrderModal() {
    document.getElementById('orderModal').classList.remove('open');
  }

  /**
   * Single Source of Truth for Order Status Update.
   *
   * Admin Panel → Orders → All Orders থেকে status update করলে এই function
   * একটি atomic batch.commit()-এর মধ্যেই নিচের সব জায়গায় সিঙ্ক করে:
   *
   *   ▸ orders/{id}.status                  — মূল order doc
   *   ▸ resellerOrders/{linkedId}.status    — যদি referral order হয়
   *   ▸ resellerWallets/{resellerId}        — commission auto credit / revert
   *       - delivered  → pendingCommission → balance + totalEarned
   *       - cancelled  → previously-credited হলে balance + totalEarned থেকে revert
   *                       pending/confirmed/processing/shipped থেকে cancelled
   *                       হলে pendingCommission থেকে বাদ
   *       - pending → confirmed/processing/shipped: pendingCommission এ যোগ
   *       - cancelled → পুনঃসক্রিয় হলে pendingCommission এ আবার যোগ
   *   ▸ resellerWallets/{id}/transactions   — credit/reversal record
   *   ▸ notifications                       — reseller + (optional) customer
   *
   * এর ফলে Reseller Dashboard, Reseller Order History, এবং কমিশন—সব এক জায়গা
   * থেকেই sync হয়। অন্য কোথাও status / commission update করার প্রয়োজন নেই।
   */
  function updateOrderStatus() {
    if (!currentOrderId) return;
    const newStatus = document.getElementById('orderStatusSelect').value;
    const order     = allOrders.find(o => o.id === currentOrderId);
    const shortId   = formatOrderId(currentOrderId);
    const statusMsg = {
      confirmed:  { title: 'অর্ডার কনফার্ম হয়েছে ✅',  msg: 'আপনার অর্ডার ' + shortId + ' কনফার্ম করা হয়েছে।' },
      processing: { title: 'অর্ডার প্রসেস হচ্ছে ⚙️',    msg: 'আপনার অর্ডার ' + shortId + ' প্রসেস করা হচ্ছে।' },
      shipped:    { title: 'অর্ডার শিপ হয়েছে 🚚',       msg: 'আপনার অর্ডার ' + shortId + ' পাঠানো হয়েছে।' },
      delivered:  { title: 'অর্ডার ডেলিভার হয়েছে 🎉',  msg: 'আপনার অর্ডার ' + shortId + ' সফলভাবে ডেলিভার হয়েছে। ধন্যবাদ!' },
      cancelled:  { title: 'অর্ডার বাতিল হয়েছে ❌',    msg: 'আপনার অর্ডার ' + shortId + ' বাতিল করা হয়েছে।' },
    };

    const PENDING_STATUSES = ['pending','confirmed','processing','shipped'];
    const orderRef = db.collection('orders').doc(currentOrderId);
    const ts       = firebase.firestore.FieldValue.serverTimestamp();
    const inc      = firebase.firestore.FieldValue.increment;

    // ── Step 1: মূল order doc সর্বশেষ অবস্থায় পড়ি (stale cache এড়াতে) ──
    orderRef.get().then(orderSnap => {
      if (!orderSnap.exists) throw new Error('order-not-found');
      const freshOrder = orderSnap.data();
      const prevStatus = freshOrder.status || 'pending';
      const resellerId = freshOrder.resellerId || null;

      if (prevStatus === newStatus) {
        adminToast('স্ট্যাটাস আগের মতোই আছে', 'info');
        closeOrderModal();
        return null;
      }

      // ── Step 2: linked resellerOrders doc খুঁজি (mainOrderId দিয়ে) ──
      const linkedQuery = resellerId
        ? db.collection('resellerOrders').where('mainOrderId', '==', currentOrderId).limit(1).get()
        : Promise.resolve(null);

      return linkedQuery.then(linkedSnap => {
        let roDoc = null;
        let roRef = null;
        if (linkedSnap && !linkedSnap.empty) {
          const d  = linkedSnap.docs[0];
          roDoc    = d.data();
          roRef    = d.ref;
        }

        const commission = roDoc
          ? Number(roDoc.commissionAmount || roDoc.totalCommission || 0)
          : 0;
        const walletRef = (resellerId && commission > 0)
          ? db.collection('resellerWallets').doc(resellerId)
          : null;

        // ── Step 3: wallet snapshot লাগবে যদি delivered হয় (balanceAfter জন্য) ──
        const walletReadPromise = (walletRef && newStatus === 'delivered')
          ? walletRef.get()
          : Promise.resolve(null);

        return walletReadPromise.then(walletSnap => {
          const batch = db.batch();

          // ── (A) মূল orders doc update ──
          batch.update(orderRef, { status: newStatus, statusUpdatedAt: ts });

          // ── (B) Linked resellerOrders doc থাকলে status sync ──
          if (roRef) {
            const roUpdate = { status: newStatus, statusUpdatedAt: ts };

            // (C) Commission auto-handling
            if (walletRef && commission > 0) {
              const prevCommissionStatus = roDoc.commissionStatus || 'unpaid';

              if (newStatus === 'delivered' && PENDING_STATUSES.includes(prevStatus)) {
                // pendingCommission → balance + totalEarned + credit transaction
                roUpdate.commissionStatus    = 'credited';
                roUpdate.commissionCreditedAt = ts;

                batch.set(walletRef, {
                  pendingCommission: inc(-commission),
                  balance:           inc(commission),
                  totalEarned:       inc(commission),
                  updatedAt:         ts
                }, { merge: true });

                const currentBalance = walletSnap && walletSnap.exists
                  ? Number(walletSnap.data().balance || 0) : 0;
                const txnRef = walletRef.collection('transactions').doc();
                batch.set(txnRef, {
                  type:           'credit',
                  amount:         commission,
                  balanceAfter:   currentBalance + commission,
                  relatedOrderId: roRef.id,
                  description:    'অর্ডার #' + shortId + ' ডেলিভার — কমিশন ক্রেডিট',
                  createdAt:      ts
                });

                sendNotification(resellerId, 'wallet_credit',
                  'কমিশন ক্রেডিট হয়েছে 💰',
                  'অর্ডার #' + shortId + ' ডেলিভার হয়েছে। ৳' + commission.toLocaleString('bn-BD') + ' কমিশন আপনার ব্যালেন্সে যোগ হয়েছে।',
                  { relatedOrderId: roRef.id }
                );
              }
              else if (newStatus === 'cancelled') {
                if (prevCommissionStatus === 'credited' || prevStatus === 'delivered') {
                  // আগে credited ছিল → balance + totalEarned থেকে revert
                  roUpdate.commissionStatus = 'cancelled';
                  batch.set(walletRef, {
                    balance:     inc(-commission),
                    totalEarned: inc(-commission),
                    updatedAt:   ts
                  }, { merge: true });

                  const txnRef = walletRef.collection('transactions').doc();
                  batch.set(txnRef, {
                    type:           'reversal',
                    amount:         -commission,
                    relatedOrderId: roRef.id,
                    description:    'অর্ডার #' + shortId + ' বাতিল — কমিশন রিভার্স',
                    createdAt:      ts
                  });
                } else if (PENDING_STATUSES.includes(prevStatus)) {
                  // pendingCommission থেকে বাদ
                  roUpdate.commissionStatus = 'cancelled';
                  batch.set(walletRef, {
                    pendingCommission: inc(-commission),
                    updatedAt:         ts
                  }, { merge: true });
                }
                sendNotification(resellerId, 'order_cancelled',
                  'অর্ডার বাতিল হয়েছে ❌',
                  'অর্ডার #' + shortId + ' বাতিল হয়েছে। ৳' + commission.toLocaleString('bn-BD') + ' কমিশন কাটা গেছে।',
                  { relatedOrderId: roRef.id }
                );
              }
              else if (PENDING_STATUSES.includes(prevStatus) && newStatus === 'pending' && prevStatus !== 'pending') {
                // confirmed/processing/shipped → pending: pendingCommission থেকে বাদ
                // শুধু তখনই বাদ হবে যদি commissionStatus 'credited' না হয়
                if (prevCommissionStatus !== 'credited' && prevCommissionStatus !== 'cancelled') {
                  roUpdate.commissionStatus = 'unpaid';
                  batch.set(walletRef, {
                    pendingCommission: inc(-commission),
                    updatedAt:         ts
                  }, { merge: true });
                }
              }
              else if (PENDING_STATUSES.includes(newStatus) && newStatus !== 'pending' && prevCommissionStatus !== 'credited') {
                // pending/cancelled → confirmed/processing/shipped: pendingCommission এ যোগ
                // কিন্তু আগে থেকে pending এ থাকলে (commissionStatus='unpaid' কিন্তু pendingCommission এ আছে) double-add এড়াতে
                // prevStatus === 'pending' হলেই শুধু যোগ হবে (প্রথমবার activate)
                // confirmed → shipped ইত্যাদি same-group transition এ যোগ হবে না
                const fromPending = prevStatus === 'pending';
                const fromCancelled = prevStatus === 'cancelled';
                if (fromPending || fromCancelled) {
                  roUpdate.commissionStatus = 'unpaid';
                  batch.set(walletRef, {
                    pendingCommission: inc(commission),
                    updatedAt:         ts
                  }, { merge: true });
                }
              }
              else if (prevStatus === 'delivered' && PENDING_STATUSES.includes(newStatus)) {
                // delivered → revert: balance + totalEarned থেকে কেটে pendingCommission এ ফেরত
                roUpdate.commissionStatus     = 'unpaid';
                roUpdate.commissionCreditedAt = firebase.firestore.FieldValue.delete();
                batch.set(walletRef, {
                  balance:           inc(-commission),
                  totalEarned:       inc(-commission),
                  pendingCommission: inc(commission),
                  updatedAt:         ts
                }, { merge: true });

                const txnRef = walletRef.collection('transactions').doc();
                batch.set(txnRef, {
                  type:           'reversal',
                  amount:         -commission,
                  relatedOrderId: roRef.id,
                  description:    'অর্ডার #' + shortId + ' স্ট্যাটাস revert — কমিশন pending এ ফেরত',
                  createdAt:      ts
                });

                sendNotification(resellerId, 'wallet_reversal',
                  'কমিশন pending এ ফেরত ⏳',
                  'অর্ডার #' + shortId + ' এর স্ট্যাটাস পরিবর্তন হওয়ায় ৳' + commission.toLocaleString('bn-BD') + ' কমিশন ব্যালেন্স থেকে pending এ ফিরিয়ে নেয়া হয়েছে।',
                  { relatedOrderId: roRef.id }
                );
              }
            }

            batch.update(roRef, roUpdate);
          }

          // ── (D) Reseller-কে status notification (commission notification ছাড়াও) ──
          if (resellerId && statusMsg[newStatus] && newStatus !== 'delivered' && newStatus !== 'cancelled') {
            // delivered/cancelled এর জন্য আলাদা wallet/order notification আগেই পাঠানো হয়েছে
            const n = statusMsg[newStatus];
            sendNotification(resellerId, 'order_' + newStatus, n.title, n.msg, { relatedOrderId: currentOrderId });
          } else if (resellerId && newStatus === 'delivered' && !(walletRef && commission > 0)) {
            // commission নেই কিন্তু reseller আছে — শুধু delivered notification
            const n = statusMsg[newStatus];
            sendNotification(resellerId, 'order_' + newStatus, n.title, n.msg, { relatedOrderId: currentOrderId });
          }

          return batch.commit();
        });
      });
    })
    .then(result => {
      if (result === null) return; // no-op (same status)
      adminToast('অর্ডার স্ট্যাটাস আপডেট হয়েছে ✅ — সব জায়গায় sync হয়েছে');
      closeOrderModal();
    })
    .catch(err => {
      console.error('[orders] status update failed', err);
      adminToast('আপডেট ব্যর্থ', 'error');
    });
  }

  // ===== PRODUCT MODAL =====
  function openAddProductModal() {
    currentEditId = null;
    document.getElementById('productModalTitle').textContent = 'নতুন পণ্য যোগ করুন';
    document.getElementById('editProductId').value = '';
    resetProductForm();
    document.getElementById('productModal').classList.add('open');
  }

  function openEditProductModal(id) {
    const p = allProducts.find(x => x.id === id);
    if (!p) return;
    currentEditId = id;
    document.getElementById('productModalTitle').textContent = 'পণ্য এডিট করুন';
    document.getElementById('editProductId').value = id;
    
    // Fill form
    document.getElementById('pTitle').value = p.title || '';
    // Make sure the category dropdown contains this product's category,
    // even if it was set before the category was added (or after deletion).
    populateProductCategorySelect();
    document.getElementById('pCategory').value = p.category || '';
    if (p.category && !categoriesCache.some(c => (c.key || '') === p.category)) {
      const sel = document.getElementById('pCategory');
      const opt = document.createElement('option');
      opt.value = p.category;
      opt.textContent = `${p.category} (পুরনো)`;
      opt.selected = true;
      sel.appendChild(opt);
    }
    document.getElementById('pBrand').value = p.brand || '';
    document.getElementById('pPrice').value = p.currentPrice || p.price || '';
    document.getElementById('pOldPrice').value = p.oldPrice || '';
    document.getElementById('pResellerCommission').value = p.resellerCommission !== undefined ? p.resellerCommission : '';
    document.getElementById('pColors').value = Array.isArray(p.colors) ? p.colors.join(', ') : (p.colors || '');
    document.getElementById('pStock').value = p.stock || '';
    document.getElementById('pDeliveryInsideName').value = p.deliveryInsideName || p.insideZoneName || 'ভিতরের জোন';
    document.getElementById('pDeliveryOutsideName').value = p.deliveryOutsideName || p.outsideZoneName || 'বাইরের জোন';
    document.getElementById('pDeliveryInside').value = p.deliveryInside !== undefined ? p.deliveryInside : (p.deliveryCharge !== undefined ? p.deliveryCharge : 70);
    document.getElementById('pDeliveryOutside').value = p.deliveryOutside !== undefined ? p.deliveryOutside : (p.deliveryCharge !== undefined ? (parseInt(p.deliveryCharge, 10) + 60) : 130);
    document.getElementById('pThumbnail').value = p.thumbnail || '';
    document.getElementById('pVideoUrl').value = p.videoUrl || '';
    document.getElementById('pDescription').value = p.description || '';
    document.getElementById('pFullDescription').value = p.fullDescription || '';
    document.getElementById('pRating').value = p.rating || 5;
    document.getElementById('pStatus').value = p.status || 'active';

    // Toggles
    setToggle('toggleFreeDelivery', p.freeDelivery);
    setToggle('toggleFeatured', p.featured);
    setToggle('toggleHot', p.hot);
    setToggle('toggleSale', p.sale);
    // Default ON for older products (so behaviour stays the same unless admin turns it off).
    setToggle('toggleCodAdvance', p.codAdvanceEnabled === undefined ? true : !!p.codAdvanceEnabled);
    // Per-product delivery info (Reviews/Delivery tab on product page)
    setToggle('toggleDeliveryInfo', p.deliveryInfoEnabled === undefined ? true : !!p.deliveryInfoEnabled);
    document.getElementById('pDeliveryStandardText').value = p.deliveryStandardText || '';
    document.getElementById('pDeliveryExpressText').value  = p.deliveryExpressText  || '';
    document.getElementById('pDeliveryFreeText').value     = p.deliveryFreeText     || '';

    // Gallery
    const gallery = p.gallery || [];
    document.getElementById('pGallery').value = JSON.stringify(gallery);
    renderGalleryPreview(gallery);

    // Thumb preview
    if (p.thumbnail) {
      const prev = document.getElementById('thumbPreview');
      prev.src = optimizeCloudinaryUrl(p.thumbnail);
      prev.style.display = 'block';
    }

    // Specs
    const specRows = document.getElementById('specRows');
    specRows.innerHTML = '';
    const specs = p.specifications || [];
    const specArr = Array.isArray(specs) ? specs : Object.entries(specs).map(([k,v])=>({label:k,value:v}));
    specArr.forEach(s => addSpecRow(s.label, s.value));

    // Delivery time & Return policy (shown above the spec rows)
    document.getElementById('pDeliveryTime').value =
      (p.deliveryTime !== undefined ? p.deliveryTime : (p.specs && p.specs.delivery) || '');
    document.getElementById('pReturnPolicy').value =
      (p.returnPolicy !== undefined ? p.returnPolicy : (p.specs && p.specs.returnPolicy) || '');

    // Custom product reviews
    const prvContainer = document.getElementById('productReviewRows');
    if (prvContainer) {
      prvContainer.innerHTML = '';
      const customReviews = Array.isArray(p.customReviews) ? p.customReviews : [];
      customReviews.forEach(rv => addProductReviewRow(rv.name, rv.loc, rv.rating, rv.text, rv.avatar));
    }

    document.getElementById('productModal').classList.add('open');
    showPage('products');
  }

  function closeProductModal() {
    document.getElementById('productModal').classList.remove('open');
    currentEditId = null;
  }

  function resetProductForm() {
    ['pTitle','pCategory','pBrand','pColors','pPrice','pOldPrice','pResellerCommission','pStock','pDeliveryInsideName','pDeliveryOutsideName','pDeliveryInside','pDeliveryOutside','pThumbnail','pGalleryInput','pVideoUrl','pDescription','pFullDescription','pDeliveryStandardText','pDeliveryExpressText','pDeliveryFreeText','pDeliveryTime','pReturnPolicy'].forEach(id => {
      const el = document.getElementById(id);
      if (el) el.value = '';
    });
    document.getElementById('pDeliveryInsideName').value = 'ভিতরের জোন';
    document.getElementById('pDeliveryOutsideName').value = 'বাইরের জোন';
    document.getElementById('pDeliveryInside').value = 70;
    document.getElementById('pDeliveryOutside').value = 130;
    document.getElementById('pRating').value = 5;
    document.getElementById('pStatus').value = 'active';
    document.getElementById('pGallery').value = '[]';
    ['toggleFreeDelivery','toggleFeatured','toggleHot','toggleSale'].forEach(id => {
      document.getElementById(id).classList.remove('on');
    });
    // Default: advance delivery payment is ON for new products.
    document.getElementById('toggleCodAdvance').classList.add('on');
    // Default: per-product delivery info section is shown for new products.
    document.getElementById('toggleDeliveryInfo').classList.add('on');
    document.getElementById('specRows').innerHTML = '';
    document.getElementById('galleryPreview').innerHTML = '';
    document.getElementById('thumbPreview').style.display = 'none';
    const prv = document.getElementById('productReviewRows');
    if (prv) prv.innerHTML = '';
    // Repopulate category dropdown so it's fresh when adding a new product
    populateProductCategorySelect();
  }

  function setToggle(id, val) {
    const el = document.getElementById(id);
    if (val) el.classList.add('on');
    else el.classList.remove('on');
  }

  function getToggle(id) {
    return document.getElementById(id).classList.contains('on');
  }

  // ===== SAVE PRODUCT =====
  // ===== SLUG GENERATION =====
  function generateSlug(name) {
    return name
      .toLowerCase()
      .replace(/[^a-z0-9\s-]/g, "")
      .replace(/\s+/g, "-")
      .replace(/-+/g, "-")
      .replace(/^-|-$/g, "");
  }

  // ============================================================
  // SEO AUTO-GENERATION HELPERS (additive; does not change product schema)
  // ============================================================
  const SEO_SITE_URL = 'https://alltrustedshop.store';
  const SEO_BRAND    = 'A.T Shop';

  function generateSeoTitle(title) {
    const t = (title || '').trim();
    if (!t) return SEO_BRAND;
    const max = 60;
    const full = `${t} | ${SEO_BRAND}`;
    return full.length <= max ? full : (t.slice(0, max - SEO_BRAND.length - 3) + '... | ' + SEO_BRAND);
  }

  function generateSeoDescription(title, desc, price) {
    const base = (desc || title || '').replace(/<[^>]+>/g, '').replace(/\s+/g, ' ').trim();
    const trimmed = base.length > 130 ? (base.slice(0, 127) + '...') : base;
    const priceStr = price ? ` মাত্র ৳${price} টাকায়।` : '';
    const out = `${trimmed}${priceStr} ${SEO_BRAND} থেকে অর্ডার করুন।`.trim();
    return out.length > 160 ? out.slice(0, 157) + '...' : out;
  }

  function generateSeoKeywords(title, category, brand) {
    const words = (title || '').toLowerCase().split(/\s+/).filter(w => w.length > 2);
    const list = [title, brand, category, ...words, SEO_BRAND, 'বাংলাদেশ', 'গ্যাজেট শপ']
      .map(s => (s || '').trim()).filter(Boolean);
    return [...new Set(list)].slice(0, 15).join(', ');
  }

  function generateCanonicalUrl(slug) {
    return `${SEO_SITE_URL}/?product=${encodeURIComponent(slug)}`;
  }

  function buildProductSchema(p, id) {
    const schema = {
      "@context": "https://schema.org",
      "@type": "Product",
      "name": p.title,
      "description": p.seoDescription || p.description || p.title,
      "image": p.thumbnail || (p.gallery && p.gallery[0]) || `${SEO_SITE_URL}/og-image.jpg`,
      "sku": id || p.slug,
      "brand": { "@type": "Brand", "name": p.brand || SEO_BRAND },
      "offers": {
        "@type": "Offer",
        "url": p.canonicalUrl || generateCanonicalUrl(p.slug || ''),
        "priceCurrency": "BDT",
        "price": String(p.currentPrice || p.price || 0),
        "availability": (Number(p.stock) > 0) ? "https://schema.org/InStock" : "https://schema.org/OutOfStock",
        "itemCondition": "https://schema.org/NewCondition"
      }
    };
    if (p.rating) {
      schema.aggregateRating = {
        "@type": "AggregateRating",
        "ratingValue": String(p.rating),
        "reviewCount": String((p.customReviews && p.customReviews.length) || 1)
      };
    }
    return schema;
  }

  function buildProductSEO(p, id) {
    const slug = p.slug || generateSlug(p.title || '');
    const seoTitle       = p.seoTitle       || generateSeoTitle(p.title);
    const seoDescription = p.seoDescription || generateSeoDescription(p.title, p.description, p.currentPrice || p.price);
    const seoKeywords    = p.seoKeywords    || generateSeoKeywords(p.title, p.category, p.brand);
    const canonicalUrl   = generateCanonicalUrl(slug);
    const enriched       = { ...p, slug, seoTitle, seoDescription, seoKeywords, canonicalUrl };
    return { slug, seoTitle, seoDescription, seoKeywords, canonicalUrl, productSchema: buildProductSchema(enriched, id) };
  }

  async function saveProduct() {
    const title = document.getElementById('pTitle').value.trim();
    const category = document.getElementById('pCategory').value.trim();
    const currentPrice = parseFloat(document.getElementById('pPrice').value) || 0;
    const oldPrice = parseFloat(document.getElementById('pOldPrice').value) || 0;
    const resellerCommission = parseFloat(document.getElementById('pResellerCommission').value) || 0;
    const colors = document.getElementById('pColors').value
      .split(',')
      .map(color => color.trim())
      .filter(Boolean);

    if (!title) { adminToast('পণ্যের নাম দিন', 'error'); return; }
    if (!category) { adminToast('ক্যাটাগরি নির্বাচন করুন', 'error'); return; }
    if (!currentPrice) { adminToast('মূল্য দিন', 'error'); return; }

    // Collect specs
    const specRows = document.querySelectorAll('.spec-row-item');
    const specifications = [];
    specRows.forEach(row => {
      const lbl = row.querySelector('.spec-label').value.trim();
      const val = row.querySelector('.spec-value').value.trim();
      if (lbl && val) specifications.push({ label: lbl, value: val });
    });

    // Gallery
    let gallery = [];
    try { gallery = JSON.parse(document.getElementById('pGallery').value || '[]'); } catch(e) {}
    const deliveryInsideValue = parseInt(document.getElementById('pDeliveryInside').value, 10);
    const deliveryOutsideValue = parseInt(document.getElementById('pDeliveryOutside').value, 10);
    const freeDelivery = getToggle('toggleFreeDelivery');
    const deliveryInside = Number.isNaN(deliveryInsideValue) ? 70 : deliveryInsideValue;
    const deliveryOutside = Number.isNaN(deliveryOutsideValue) ? 130 : deliveryOutsideValue;
    const deliveryInsideName = document.getElementById('pDeliveryInsideName').value.trim() || 'ভিতরের জোন';
    const deliveryOutsideName = document.getElementById('pDeliveryOutsideName').value.trim() || 'বাইরের জোন';

    const slug = generateSlug(title);
    const baseDescription = document.getElementById('pDescription').value.trim();

    // SEO auto-generation (overwritten on every save so they stay in sync with edits)
    const seoTitle       = generateSeoTitle(title);
    const seoDescription = generateSeoDescription(title, baseDescription, currentPrice);
    const seoKeywords    = generateSeoKeywords(title, category, document.getElementById('pBrand').value.trim());
    const canonicalUrl   = generateCanonicalUrl(slug);

    const productData = {
      title,
      slug,
      // ── SEO fields (auto) ──
      seoTitle,
      seoDescription,
      seoKeywords,
      canonicalUrl,
      lastModified: firebase.firestore.FieldValue.serverTimestamp(),
      // ── existing fields (unchanged) ──
      category,
      brand: document.getElementById('pBrand').value.trim(),
      currentPrice,
      price: currentPrice,
      oldPrice,
      resellerCommission,
      colors,
      stock: parseInt(document.getElementById('pStock').value) || 0,
      deliveryInsideName,
      deliveryOutsideName,
      deliveryInside,
      deliveryOutside,
      deliveryCharge: deliveryInside,
      freeDelivery,
      // If false, the product page's order modal hides the COD advance-payment box
      // and shows a blue-tick note instead.
      codAdvanceEnabled: getToggle('toggleCodAdvance'),
      // Per-product delivery info shown in product page Delivery tab.
      deliveryInfoEnabled: getToggle('toggleDeliveryInfo'),
      deliveryStandardText: document.getElementById('pDeliveryStandardText').value.trim(),
      deliveryExpressText:  document.getElementById('pDeliveryExpressText').value.trim(),
      deliveryFreeText:     document.getElementById('pDeliveryFreeText').value.trim(),
      featured: getToggle('toggleFeatured'),
      hot: getToggle('toggleHot'),
      sale: getToggle('toggleSale'),
      thumbnail: document.getElementById('pThumbnail').value.trim(),
      gallery,
      videoUrl: document.getElementById('pVideoUrl').value.trim(),
      description: baseDescription,
      fullDescription: document.getElementById('pFullDescription').value.trim(),
      specifications,
      deliveryTime: document.getElementById('pDeliveryTime').value.trim(),
      returnPolicy: document.getElementById('pReturnPolicy').value.trim(),
      customReviews: collectProductReviews(),
      rating: parseFloat(document.getElementById('pRating').value) || 5,
      status: document.getElementById('pStatus').value,
    };

    // Stored Product JSON-LD so the storefront can render it without re-deriving.
    productData.productSchema = buildProductSchema(productData, currentEditId || slug);

    const btn = document.getElementById('saveProductBtn');
    btn.disabled = true;
    btn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> সেভ হচ্ছে...';

    try {
      if (currentEditId) {
        await db.collection('products').doc(currentEditId).update(productData);
        adminToast('পণ্য আপডেট হয়েছে ✅');
      } else {
        productData.createdAt = firebase.firestore.FieldValue.serverTimestamp();
        const ref = await db.collection('products').add(productData);
        // Re-stamp schema with the real Firestore doc id as SKU
        await ref.update({ productSchema: buildProductSchema(productData, ref.id) });
        adminToast('নতুন পণ্য যোগ হয়েছে 🎉');
      }
      closeProductModal();
      showPage('products');
    } catch (err) {
      adminToast('সেভ ব্যর্থ: ' + err.message, 'error');
    } finally {
      btn.disabled = false;
      btn.innerHTML = '<i class="fas fa-save"></i> পণ্য সেভ করুন';
    }
  }

  // ===== DELETE =====
  function openDeleteModal(id, name) {
    deleteTargetId = id;
    document.getElementById('deleteProductName').textContent = name;
    document.getElementById('deleteModal').classList.add('open');
  }

  function confirmDelete() {
    if (!deleteTargetId) return;
    const id = deleteTargetId;
    db.collection('products').doc(id).delete()
      .then(() => {
        // Sitemap is generated live from Firestore by /functions/sitemap.xml.js,
        // so removing the product doc automatically removes it from sitemap.xml.
        adminToast('পণ্য মুছে ফেলা হয়েছে');
        document.getElementById('deleteModal').classList.remove('open');
      })
      .catch(() => adminToast('মুছতে ব্যর্থ', 'error'));
    deleteTargetId = null;
  }

  // ============================================================
  // BACKFILL: ensure every existing product has slug/seo*/lastModified.
  // Guarded by localStorage so it runs once per browser. Manual re-run:
  //   backfillProductSEO(true)   // from devtools console
  // ============================================================
  async function backfillProductSEO(force = false) {
    const FLAG = 'atshop_seo_backfill_v1';
    if (!force && localStorage.getItem(FLAG) === 'done') return 0;
    const snap = await db.collection('products').get();
    let writes = 0;
    let batch = db.batch();
    let opCount = 0;
    for (const doc of snap.docs) {
      const p = doc.data() || {};
      const needs = !p.slug || !p.seoTitle || !p.seoDescription || !p.seoKeywords
                 || !p.canonicalUrl || !p.lastModified || !p.productSchema;
      if (!needs) continue;
      const seo = buildProductSEO(p, doc.id);
      batch.update(doc.ref, {
        slug:            seo.slug,
        seoTitle:        p.seoTitle        || seo.seoTitle,
        seoDescription:  p.seoDescription  || seo.seoDescription,
        seoKeywords:     p.seoKeywords     || seo.seoKeywords,
        canonicalUrl:    seo.canonicalUrl,
        productSchema:   seo.productSchema,
        lastModified:    p.lastModified || p.createdAt || firebase.firestore.FieldValue.serverTimestamp(),
      });
      writes++; opCount++;
      if (opCount >= 400) { await batch.commit(); batch = db.batch(); opCount = 0; }
    }
    if (opCount) await batch.commit();
    localStorage.setItem(FLAG, 'done');
    if (writes) adminToast(`SEO backfill: ${writes} পণ্য আপডেট হয়েছে`);
    return writes;
  }
  window.backfillProductSEO = backfillProductSEO;

  // ===== SPEC ROWS =====
  let specCounter = 0;
  function escapeAttr(value = '') {
    return String(value)
      .replace(/&/g, '&amp;')
      .replace(/"/g, '&quot;')
      .replace(/</g, '&lt;')
      .replace(/>/g, '&gt;');
  }

  function addSpecRow(label = '', value = '') {
    const id = ++specCounter;
    const container = document.getElementById('specRows');
    const row = document.createElement('div');
    row.className = 'spec-row spec-row-item';
    row.id = 'spec-' + id;
    row.innerHTML = `
      <input type="text" class="spec-label" placeholder="স্পেক নাম (যেমন: র‍্যাম)" value="${escapeAttr(label)}" />
      <input type="text" class="spec-value" placeholder="মান (যেমন: ৮ জিবি)" value="${escapeAttr(value)}" />
      <button type="button" class="spec-remove" onclick="document.getElementById('spec-${id}').remove()"><i class="fas fa-times"></i></button>
    `;
    container.appendChild(row);
  }

  // ===== PRODUCT CUSTOM REVIEWS =====
  let productReviewCounter = 0;
  function addProductReviewRow(name = '', loc = '', rating = 5, text = '', avatar = '') {
    const id = ++productReviewCounter;
    const container = document.getElementById('productReviewRows');
    if (!container) return;
    const row = document.createElement('div');
    row.className = 'product-review-row';
    row.id = 'prv-' + id;
    row.style.cssText = 'border:1px solid #e2e8f0;border-radius:8px;padding:12px;background:#f8fafc;position:relative;';
    row.innerHTML = `
      <button type="button" onclick="document.getElementById('prv-${id}').remove()"
        style="position:absolute;top:8px;right:8px;background:#ef4444;color:#fff;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:0.75rem;display:flex;align-items:center;justify-content:center;" title="মুছুন">
        <i class="fas fa-times"></i>
      </button>
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px;">
        <input type="text" class="form-control prv-name" placeholder="রিভিউয়ারের নাম" value="${escapeAttr(name)}" />
        <input type="text" class="form-control prv-loc" placeholder="লোকেশন (যেমন: ঢাকা)" value="${escapeAttr(loc)}" />
      </div>
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px;">
        <input type="number" class="form-control prv-rating" min="1" max="5" step="1" placeholder="রেটিং (১-৫)" value="${escapeAttr(String(rating || 5))}" />
        <input type="text" class="form-control prv-avatar" maxlength="2" placeholder="অ্যাভাটার অক্ষর (ঐচ্ছিক)" value="${escapeAttr(avatar)}" />
      </div>
      <textarea class="form-control prv-text" rows="2" placeholder="রিভিউ টেক্সট লিখুন...">${escapeHtmlSafe(text)}</textarea>
    `;
    container.appendChild(row);
  }

  function escapeHtmlSafe(s) {
    return String(s == null ? '' : s)
      .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
  }

  function collectProductReviews() {
    const rows = document.querySelectorAll('#productReviewRows .product-review-row');
    const out = [];
    rows.forEach(r => {
      const name = r.querySelector('.prv-name').value.trim();
      const text = r.querySelector('.prv-text').value.trim();
      if (!name && !text) return;
      const ratingNum = parseInt(r.querySelector('.prv-rating').value, 10);
      out.push({
        name: name || 'ক্রেতা',
        loc: r.querySelector('.prv-loc').value.trim(),
        rating: Math.max(1, Math.min(5, isNaN(ratingNum) ? 5 : ratingNum)),
        text,
        avatar: r.querySelector('.prv-avatar').value.trim()
      });
    });
    return out;
  }

  // ===== GALLERY =====
  function addGalleryImage() {
    const url = document.getElementById('pGalleryInput').value.trim();
    if (!url) return;
    let gallery = [];
    try { gallery = JSON.parse(document.getElementById('pGallery').value || '[]'); } catch(e) {}
    if (!gallery.includes(url)) {
      gallery.push(url);
      document.getElementById('pGallery').value = JSON.stringify(gallery);
      renderGalleryPreview(gallery);
    }
    document.getElementById('pGalleryInput').value = '';
  }

  function renderGalleryPreview(gallery) {
    const container = document.getElementById('galleryPreview');
    container.innerHTML = gallery.map((url, i) => `
      <div class="gallery-item">
        <img src="${optimizeCloudinaryUrl(url)}" alt="gallery ${i}" onerror="this.style.opacity=0.3" />
        <button class="gallery-remove" onclick="removeGalleryImage(${i})"><i class="fas fa-times"></i></button>
      </div>
    `).join('');
  }

  function removeGalleryImage(index) {
    let gallery = [];
    try { gallery = JSON.parse(document.getElementById('pGallery').value || '[]'); } catch(e) {}
    gallery.splice(index, 1);
    document.getElementById('pGallery').value = JSON.stringify(gallery);
    renderGalleryPreview(gallery);
  }

  function previewThumb(url) {
    const prev = document.getElementById('thumbPreview');
    if (url) { prev.src = optimizeCloudinaryUrl(url); prev.style.display = 'block'; }
    else prev.style.display = 'none';
  }

  // ===== CLOUDINARY UPLOAD =====
  // Translate generic fetch errors (e.g. "Failed to fetch") into actionable hints.
  // A TypeError from fetch() can mean: CSP block, CORS preflight rejection,
  // offline network, DNS failure, or browser extension interference.
  function __cldExplainError(err) {
    try {
      // Always log the raw error to DevTools for diagnostics.
      console.error('[Cloudinary upload error]', err && err.name, err && err.message, err);
    } catch (_) {}
    const msg = (err && err.message) ? String(err.message) : String(err || 'Unknown error');
    if (/Failed to fetch|NetworkError|Load failed/i.test(msg)) {
      if (typeof navigator !== 'undefined' && navigator.onLine === false) {
        return 'নেটওয়ার্ক সংযোগ নেই — ইন্টারনেট চেক করুন';
      }
      return 'আপলোড নেটওয়ার্ক ত্রুটি: ' + msg +
        ' — সম্ভাব্য কারণ: CSP / CORS ব্লক, অথবা api.cloudinary.com পৌঁছানো যাচ্ছে না। DevTools > Console দেখুন।';
    }
    return 'আপলোড ত্রুটি: ' + msg;
  }
  function uploadToCloudinary(target) {
    const cloudName = localStorage.getItem('at_cloud_name') || cloudinaryConfig.cloudName;
    const uploadPreset = localStorage.getItem('at_upload_preset') || cloudinaryConfig.uploadPreset;
    
    if (!cloudName || !uploadPreset) {
      adminToast('প্রথমে Settings এ Cloudinary Config সেভ করুন', 'error');
      showPage('settings');
      return;
    }

    const input = document.createElement('input');
    input.type = 'file';
    input.accept = 'image/*';
    input.multiple = target === 'gallery';
    input.onchange = async (e) => {
      const files = Array.from(e.target.files);
      for (const file of files) {
        const formData = new FormData();
        formData.append('file', file);
        formData.append('upload_preset', uploadPreset);
        adminToast('আপলোড হচ্ছে...', 'success');
        try {
          const res = await fetch(`https://api.cloudinary.com/v1_1/${cloudName}/image/upload`, { method: 'POST', body: formData });
          const data = await res.json();
          if (data.secure_url) {
            if (target === 'thumbnail') {
              document.getElementById('pThumbnail').value = data.secure_url;
              previewThumb(data.secure_url);
            } else {
              document.getElementById('pGalleryInput').value = data.secure_url;
              addGalleryImage();
            }
            adminToast('আপলোড সফল! ✅');
          } else {
            adminToast('আপলোড ব্যর্থ', 'error');
          }
        } catch (err) {
          adminToast(__cldExplainError(err), 'error');
        }
      }
    };
    input.click();
  }

  // ===== SETTINGS =====
  function loadSettings() {
    db.collection('settings').doc('shop').get().then(doc => {
      if (doc.exists) {
        const d = doc.data();
        const social = d.socialLinks || {};
        document.getElementById('settingFacebookUrl').value = social.facebook || d.facebook || '';
        document.getElementById('settingInstagramUrl').value = social.instagram || d.instagram || '';
        document.getElementById('settingYoutubeUrl').value = social.youtube || d.youtube || '';
        document.getElementById('settingWhatsappUrl').value = social.whatsapp || d.whatsapp || '';
        document.getElementById('settingTelegramUrl').value = social.telegram || d.telegram || '';
        document.getElementById('settingWhatsappPhone').value = social.whatsappPhone || d.whatsappPhone || '';
        if (d.shopName) document.getElementById('settingShopName').value = d.shopName;
        if (d.phone) document.getElementById('settingPhone').value = d.phone;
        if (d.email) document.getElementById('settingEmail').value = d.email;
        if (d.bkash) document.getElementById('settingBkash').value = d.bkash;
        if (d.nagad) document.getElementById('settingNagad').value = d.nagad;
        if (d.headerNotice) document.getElementById('settingHeaderNotice').value = d.headerNotice;

        if (d.shopLogo) {
          document.getElementById('settingShopLogo').value = d.shopLogo;
          previewShopLogo(d.shopLogo);
        }
        // Load logo text (shown beside header logo)
        if (typeof d.logoText === 'string') {
          document.getElementById('settingLogoText').value = d.logoText;
        }
      }
    });
    // Load cloudinary from localStorage
    const cn = localStorage.getItem('at_cloud_name');
    const up = localStorage.getItem('at_upload_preset');
    if (cn) document.getElementById('settingCloudName').value = cn;
    if (up) document.getElementById('settingUploadPreset').value = up;
  }

  function saveShopSettings() {
    const data = {
      shopName: document.getElementById('settingShopName').value,
      phone: document.getElementById('settingPhone').value,
      email: document.getElementById('settingEmail').value.trim(),
      bkash: document.getElementById('settingBkash').value,
      nagad: document.getElementById('settingNagad').value,
      headerNotice: document.getElementById('settingHeaderNotice').value,

      shopLogo: document.getElementById('settingShopLogo').value.trim(),
      // Logo text (displayed beside the header logo)
      logoText: document.getElementById('settingLogoText').value.trim(),
    };
    db.collection('settings').doc('shop').set(data, { merge: true })
      .then(() => adminToast('শপ তথ্য সেভ হয়েছে ✅'))
      .catch(() => adminToast('সেভ ব্যর্থ', 'error'));
  }

  function previewShopLogo(url) {
    const img = document.getElementById('shopLogoPreview');
    if (!img) return;
    if (url && /^https?:\/\//i.test(url)) {
      img.src = optimizeCloudinaryUrl(url);
      img.style.display = 'inline-block';
    } else {
      img.style.display = 'none';
    }
  }

  function uploadShopLogoToCloudinary() {
    const cfg = (typeof cloudinaryConfig !== 'undefined' && cloudinaryConfig) || {
      cloudName: localStorage.getItem('at_cloud_name'),
      uploadPreset: localStorage.getItem('at_upload_preset')
    };
    if (!cfg.cloudName || !cfg.uploadPreset) {
      adminToast('Cloudinary Config আগে সেট করুন (Settings > Cloudinary)', 'error');
      return;
    }
    const input = document.createElement('input');
    input.type = 'file';
    input.accept = 'image/*';
    input.onchange = async (e) => {
      const file = e.target.files[0];
      if (!file) return;
      const fd = new FormData();
      fd.append('file', file);
      fd.append('upload_preset', cfg.uploadPreset);
      try {
        adminToast('আপলোড হচ্ছে...', 'success');
        const r = await fetch(`https://api.cloudinary.com/v1_1/${cfg.cloudName}/image/upload`, { method: 'POST', body: fd });
        const data = await r.json();
        if (data.secure_url) {
          document.getElementById('settingShopLogo').value = data.secure_url;
          previewShopLogo(data.secure_url);
          adminToast('লোগো আপলোড হয়েছে ✅');
        } else {
          adminToast('আপলোড ব্যর্থ', 'error');
        }
      } catch (err) {
        adminToast(__cldExplainError(err), 'error');
      }
    };
    input.click();
  }

  function saveSocialSettings() {
    const socialLinks = {
      facebook: document.getElementById('settingFacebookUrl').value.trim(),
      instagram: document.getElementById('settingInstagramUrl').value.trim(),
      youtube: document.getElementById('settingYoutubeUrl').value.trim(),
      whatsapp: document.getElementById('settingWhatsappUrl').value.trim(),
      telegram: document.getElementById('settingTelegramUrl').value.trim(),
      whatsappPhone: document.getElementById('settingWhatsappPhone').value.trim().replace(/\D/g, '')
    };
    db.collection('settings').doc('shop').set({ socialLinks }, { merge: true })
      .then(() => adminToast('সোশ্যাল মিডিয়া লিংক সেভ হয়েছে ✅'))
      .catch(() => adminToast('সেভ ব্যর্থ', 'error'));
  }

  function saveCloudinarySettings() {
    const cn = document.getElementById('settingCloudName').value.trim();
    const up = document.getElementById('settingUploadPreset').value.trim();
    if (cn) localStorage.setItem('at_cloud_name', cn);
    if (up) localStorage.setItem('at_upload_preset', up);
    cloudinaryConfig = { cloudName: cn, uploadPreset: up };
    adminToast('Cloudinary Config সেভ হয়েছে ✅');
  }

  // ===== MOBILE =====
  (function() {
    var btn = document.getElementById('sidebarToggle');
    if (btn) btn.style.display = window.innerWidth <= 768 ? 'flex' : 'none';
  })();
  window.addEventListener('resize', () => {
    var btn = document.getElementById('sidebarToggle');
    if (btn) btn.style.display = window.innerWidth <= 768 ? 'flex' : 'none';
  });
  document.addEventListener('click', e => {
    const sidebar = document.getElementById('sidebar');
    if (window.innerWidth <= 768 && !sidebar.contains(e.target) && e.target.id !== 'sidebarToggle' && !e.target.closest('#sidebarToggle')) {
      sidebar.classList.remove('open');
    }
  }, { passive: true });

  // Close modals on outside click
  ['productModal','orderModal','deleteModal','reviewModal','categoryModal','genericConfirm','addResellerModal'].forEach(id => {
    const el = document.getElementById(id);
    if (el) el.addEventListener('click', function(e) {
      if (e.target === this) this.classList.remove('open');
    });
  });

  // =====================================================================
  // ===================== CONTENT MANAGEMENT ============================
  // =====================================================================
  function escHTML(s) {
    return String(s == null ? '' : s)
      .replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;')
      .replace(/"/g,'&quot;').replace(/'/g,'&#39;');
  }
  function attr(s) { return escHTML(s); }
  function confirmModal(msg, onYes) {
    const m = document.getElementById('genericConfirm');
    document.getElementById('genericConfirmMsg').textContent = msg || 'আপনি কি নিশ্চিত?';
    const btn = document.getElementById('genericConfirmOk');
    const newBtn = btn.cloneNode(true);
    btn.parentNode.replaceChild(newBtn, btn);
    newBtn.addEventListener('click', function() {
      m.classList.remove('open');
      try { onYes(); } catch (e) { console.error(e); }
    });
    m.classList.add('open');
  }
  function fmtTs(ts) {
    try {
      const d = ts && ts.toDate ? ts.toDate() : (ts ? new Date(ts) : null);
      if (!d || isNaN(d.getTime())) return '—';
      return d.toLocaleString('bn-BD');
    } catch (e) { return '—'; }
  }

  // ===================== MARQUEE =======================
  let marqueeItems = [];
  function listenMarquee() {
    db.collection('settings').doc('marquee').onSnapshot(snap => {
      const data = snap.exists ? snap.data() : null;
      marqueeItems = (data && Array.isArray(data.items)) ? data.items.slice() : [];
      renderMarqueeList();
    }, err => console.error('marquee', err));
  }
  function renderMarqueeList() {
    const list = document.getElementById('marqueeList');
    if (!list) return;
    if (!marqueeItems.length) {
      list.innerHTML = '<p style="color:#94a3b8;font-size:0.9rem;">এখনও কোনো লাইন নেই। উপরে "নতুন লাইন" বাটনে ক্লিক করুন।</p>';
      return;
    }
    list.innerHTML = marqueeItems.map((t, i) => `
      <div style="display:flex;gap:8px;align-items:center;">
        <input class="form-control" type="text" value="${attr(t)}" oninput="marqueeItems[${i}] = this.value" placeholder="যেমন: 🔥 মেগা সেল চলছে!" />
        <button class="btn btn-danger btn-sm" onclick="removeMarqueeItem(${i})"><i class="fas fa-trash"></i></button>
      </div>`).join('');
  }
  function addMarqueeItem() { marqueeItems.push(''); renderMarqueeList(); }
  function removeMarqueeItem(i) { marqueeItems.splice(i, 1); renderMarqueeList(); }
  function saveMarquee() {
    const clean = marqueeItems.map(s => String(s || '').trim()).filter(Boolean);
    db.collection('settings').doc('marquee').set({ items: clean, updatedAt: firebase.firestore.FieldValue.serverTimestamp() }, { merge: true })
      .then(() => adminToast('মার্কি সংরক্ষণ হয়েছে', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // ===================== WHY CHOOSE US =======================
  let whyItems = [];
  function listenWhyChoose() {
    db.collection('settings').doc('whychoose').onSnapshot(snap => {
      const data = snap.exists ? snap.data() : null;
      whyItems = (data && Array.isArray(data.items)) ? data.items.map(it => ({
        icon: it.icon || 'fas fa-star', title: it.title || '', desc: it.desc || ''
      })) : [];
      renderWhyChooseList();
    }, err => console.error('whychoose', err));
  }
  function renderWhyChooseList() {
    const list = document.getElementById('whyChooseList');
    if (!list) return;
    if (!whyItems.length) {
      list.innerHTML = '<p style="color:#94a3b8;font-size:0.9rem;">এখনও কোনো আইটেম নেই। উপরে "নতুন আইটেম" বাটনে ক্লিক করুন।</p>';
      return;
    }
    list.innerHTML = whyItems.map((it, i) => `
      <div style="border:1px solid #e2e8f0;border-radius:10px;padding:12px;background:#f8fafc;">
        <div class="form-grid">
          <div class="form-group">
            <label class="form-label">আইকন (Font Awesome class)</label>
            <input class="form-control" type="text" value="${attr(it.icon)}" oninput="whyItems[${i}].icon = this.value" placeholder="fas fa-shield-alt" />
          </div>
          <div class="form-group">
            <label class="form-label">টাইটেল</label>
            <input class="form-control" type="text" value="${attr(it.title)}" oninput="whyItems[${i}].title = this.value" placeholder="১০০% অরিজিনাল" />
          </div>
          <div class="form-group form-full">
            <label class="form-label">বিবরণ</label>
            <input class="form-control" type="text" value="${attr(it.desc)}" oninput="whyItems[${i}].desc = this.value" placeholder="সকল পণ্য সম্পূর্ণ অরিজিনাল ও মানসম্পন্ন" />
          </div>
        </div>
        <div style="margin-top:8px;text-align:right;">
          <button class="btn btn-danger btn-sm" onclick="removeWhyItem(${i})"><i class="fas fa-trash"></i> মুছুন</button>
        </div>
      </div>`).join('');
  }
  function addWhyChooseItem() { whyItems.push({ icon:'fas fa-star', title:'', desc:'' }); renderWhyChooseList(); }
  function removeWhyItem(i) { whyItems.splice(i, 1); renderWhyChooseList(); }
  function saveWhyChoose() {
    const clean = whyItems.map(it => ({
      icon: String(it.icon || '').trim() || 'fas fa-star',
      title: String(it.title || '').trim(),
      desc: String(it.desc || '').trim()
    })).filter(it => it.title || it.desc);
    db.collection('settings').doc('whychoose').set({ items: clean, updatedAt: firebase.firestore.FieldValue.serverTimestamp() }, { merge: true })
      .then(() => adminToast('সংরক্ষণ হয়েছে', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // ===================== BANNER SLIDER =======================
  // Firestore doc: settings/banners
  // { speed: <ms>, items: [{ desktopUrl, mobileUrl, linkType, linkTarget, customUrl, alt, enabled, order }] }
  let bannerItems = [];
  let bannerSpeedVal = 5000;

  function listenBanners() {
    db.collection('settings').doc('banners').onSnapshot(snap => {
      const data = snap.exists ? snap.data() : null;
      bannerItems = (data && Array.isArray(data.items)) ? data.items.map(it => ({
        desktopUrl: it.desktopUrl || '',
        mobileUrl:  it.mobileUrl  || '',
        linkType:   it.linkType   || 'none',
        linkTarget: it.linkTarget || '',
        customUrl:  it.customUrl  || '',
        alt:        it.alt        || '',
        enabled:    it.enabled !== false,
        order:      Number(it.order) || 0
      })) : [];
      bannerItems.sort((a, b) => (a.order || 0) - (b.order || 0));
      bannerSpeedVal = (data && Number(data.speed) >= 1500) ? Number(data.speed) : 5000;
      const sp = document.getElementById('bannerSpeed');
      if (sp && document.activeElement !== sp) sp.value = bannerSpeedVal;
      renderBannersList();
    }, err => console.error('banners', err));
  }

  function bannerCategoryOptions(selectedKey) {
    const opts = ['<option value="">— ক্যাটাগরি নির্বাচন করুন —</option>'];
    (categoriesCache || []).forEach(c => {
      const k = c.key || '';
      const n = c.name || c.key || '';
      if (!k) return;
      const sel = (String(selectedKey) === String(k)) ? ' selected' : '';
      opts.push('<option value="' + attr(k) + '"' + sel + '>' + escHTML(n) + '</option>');
    });
    return opts.join('');
  }

  function bannerProductOptions(selectedId) {
    const opts = ['<option value="">— প্রোডাক্ট নির্বাচন করুন —</option>'];
    (allProductsCache || []).forEach(p => {
      const sel = (String(selectedId) === String(p.id)) ? ' selected' : '';
      opts.push('<option value="' + attr(p.id) + '"' + sel + '>' + escHTML(p.title || p.id) + '</option>');
    });
    return opts.join('');
  }

  function renderBannersList() {
    const list = document.getElementById('bannersList');
    if (!list) return;
    if (!bannerItems.length) {
      list.innerHTML = '<p style="color:#94a3b8;font-size:0.9rem;">এখনও কোনো ব্যানার যোগ করা হয়নি। উপরে "নতুন ব্যানার" বাটনে ক্লিক করুন।</p>';
      return;
    }
    list.innerHTML = bannerItems.map((it, i) => {
      const linkType = it.linkType || 'none';
      const showCategory = linkType === 'category' ? '' : 'display:none;';
      const showProduct  = linkType === 'product'  ? '' : 'display:none;';
      const showCustom   = (linkType === 'url' || linkType === 'custom') ? '' : 'display:none;';
      return `
      <div style="border:1px solid #e2e8f0;border-radius:10px;padding:14px;background:#f8fafc;">
        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:8px;">
          <strong style="color:#1e293b;">ব্যানার #${i + 1}</strong>
          <div style="display:flex;gap:6px;flex-wrap:wrap;">
            <button class="btn btn-outline btn-sm" onclick="moveBannerUp(${i})" title="উপরে নিন" ${i === 0 ? 'disabled' : ''}><i class="fas fa-arrow-up"></i></button>
            <button class="btn btn-outline btn-sm" onclick="moveBannerDown(${i})" title="নিচে নিন" ${i === bannerItems.length - 1 ? 'disabled' : ''}><i class="fas fa-arrow-down"></i></button>
            <label style="display:inline-flex;align-items:center;gap:6px;background:#fff;padding:6px 10px;border:1px solid #e2e8f0;border-radius:8px;font-size:0.85rem;color:#334155;cursor:pointer;">
              <input type="checkbox" ${it.enabled ? 'checked' : ''} onchange="bannerItems[${i}].enabled = this.checked" /> সক্রিয়
            </label>
            <button class="btn btn-danger btn-sm" onclick="removeBannerItem(${i})"><i class="fas fa-trash"></i></button>
          </div>
        </div>

        <div class="form-grid">
          <div class="form-group">
            <label class="form-label">ডেস্কটপ ব্যানার URL</label>
            <div style="display:flex;gap:6px;">
              <input class="form-control" type="text" id="bannerDesk_${i}" value="${attr(it.desktopUrl)}" oninput="bannerItems[${i}].desktopUrl = this.value; bannerPreview(${i},'desk')" placeholder="https://... অথবা আপলোড বাটনে ক্লিক করুন" />
              <button type="button" class="btn btn-outline btn-sm" onclick="uploadBannerImage(${i}, 'desktop'); return false;" title="ডেস্কটপ ছবি আপলোড"><i class="fas fa-upload"></i></button>
            </div>
            <small style="color:#94a3b8;font-size:0.75rem;display:block;margin-top:4px;">সর্বোচ্চ সাইজ: 1920×600 px, ফাইল 2MB এর কম রাখুন (JPG/PNG/WebP)।</small>
            <div style="margin-top:6px;${it.desktopUrl ? '' : 'display:none;'}" id="bannerDeskPrev_${i}">
              <img src="${optimizeCloudinaryUrl(attr(it.desktopUrl))}" alt="" style="max-width:100%;max-height:120px;border-radius:6px;border:1px solid #e2e8f0;" />
            </div>
          </div>

          <div class="form-group">
            <label class="form-label">মোবাইল ব্যানার URL</label>
            <div style="display:flex;gap:6px;">
              <input class="form-control" type="text" id="bannerMob_${i}" value="${attr(it.mobileUrl)}" oninput="bannerItems[${i}].mobileUrl = this.value; bannerPreview(${i},'mob')" placeholder="https://... অথবা আপলোড বাটনে ক্লিক করুন" />
              <button type="button" class="btn btn-outline btn-sm" onclick="uploadBannerImage(${i}, 'mobile'); return false;" title="মোবাইল ছবি আপলোড"><i class="fas fa-upload"></i></button>
            </div>
            <small style="color:#94a3b8;font-size:0.75rem;display:block;margin-top:4px;">সর্বোচ্চ সাইজ: 800×800 px, ফাইল 1MB এর কম রাখুন (JPG/PNG/WebP)।</small>
            <div style="margin-top:6px;${it.mobileUrl ? '' : 'display:none;'}" id="bannerMobPrev_${i}">
              <img src="${optimizeCloudinaryUrl(attr(it.mobileUrl))}" alt="" style="max-width:100%;max-height:120px;border-radius:6px;border:1px solid #e2e8f0;" />
            </div>
          </div>

          <div class="form-group">
            <label class="form-label">লিংক টাইপ</label>
            <select class="form-control" onchange="bannerItems[${i}].linkType = this.value; renderBannersList();">
              <option value="none"     ${linkType === 'none'     ? 'selected' : ''}>কোনো লিংক নয়</option>
              <option value="offer"    ${linkType === 'offer'    ? 'selected' : ''}>অফার পেজ</option>
              <option value="category" ${linkType === 'category' ? 'selected' : ''}>ক্যাটাগরি পেজ</option>
              <option value="product"  ${linkType === 'product'  ? 'selected' : ''}>প্রোডাক্ট পেজ</option>
              <option value="custom"   ${(linkType === 'custom' || linkType === 'url') ? 'selected' : ''}>কাস্টম URL</option>
            </select>
          </div>

          <div class="form-group" style="${showCategory}">
            <label class="form-label">ক্যাটাগরি</label>
            <select class="form-control" onchange="bannerItems[${i}].linkTarget = this.value">
              ${bannerCategoryOptions(it.linkTarget)}
            </select>
          </div>

          <div class="form-group" style="${showProduct}">
            <label class="form-label">প্রোডাক্ট</label>
            <select class="form-control" onchange="bannerItems[${i}].linkTarget = this.value">
              ${bannerProductOptions(it.linkTarget)}
            </select>
          </div>

          <div class="form-group form-full" style="${showCustom}">
            <label class="form-label">কাস্টম URL</label>
            <input class="form-control" type="text" value="${attr(it.customUrl)}" oninput="bannerItems[${i}].customUrl = this.value" placeholder="https://example.com/page" />
          </div>

          <div class="form-group">
            <label class="form-label">Alt টেক্সট (অপশনাল)</label>
            <input class="form-control" type="text" value="${attr(it.alt)}" oninput="bannerItems[${i}].alt = this.value" placeholder="ব্যানার বিবরণ" />
          </div>

          <div class="form-group">
            <label class="form-label">ক্রম (Order)</label>
            <input class="form-control" type="number" value="${Number(it.order) || 0}" oninput="bannerItems[${i}].order = parseInt(this.value)||0" />
          </div>
        </div>
      </div>`;
    }).join('');
  }

  function bannerPreview(i, which) {
    const it = bannerItems[i]; if (!it) return;
    const url = which === 'desk' ? it.desktopUrl : it.mobileUrl;
    const wrap = document.getElementById(which === 'desk' ? ('bannerDeskPrev_' + i) : ('bannerMobPrev_' + i));
    if (!wrap) return;
    if (url && /^https?:\/\//i.test(url)) {
      wrap.style.display = '';
      const img = wrap.querySelector('img');
      if (img) img.src = optimizeCloudinaryUrl(url);
    } else {
      wrap.style.display = 'none';
    }
  }

  function addBannerItem() {
    const nextOrder = bannerItems.reduce((m, it) => Math.max(m, Number(it.order) || 0), 0) + 1;
    bannerItems.push({
      desktopUrl: '', mobileUrl: '', linkType: 'none', linkTarget: '',
      customUrl: '', alt: '', enabled: true, order: nextOrder
    });
    renderBannersList();
  }

  function removeBannerItem(i) {
    confirmModal('এই ব্যানার মুছে ফেলবেন?', () => {
      bannerItems.splice(i, 1);
      renderBannersList();
    });
  }

  function moveBannerUp(i) {
    if (i <= 0) return;
    const tmp = bannerItems[i - 1];
    bannerItems[i - 1] = bannerItems[i];
    bannerItems[i] = tmp;
    // Normalize order numbers to reflect new positions
    bannerItems.forEach((it, idx) => it.order = idx + 1);
    renderBannersList();
  }
  function moveBannerDown(i) {
    if (i >= bannerItems.length - 1) return;
    const tmp = bannerItems[i + 1];
    bannerItems[i + 1] = bannerItems[i];
    bannerItems[i] = tmp;
    bannerItems.forEach((it, idx) => it.order = idx + 1);
    renderBannersList();
  }

  function uploadBannerImage(i, which) {
    const cloudName = (localStorage.getItem('at_cloud_name') || (typeof cloudinaryConfig !== 'undefined' ? cloudinaryConfig.cloudName : '') || '').trim();
    const uploadPreset = (localStorage.getItem('at_upload_preset') || (typeof cloudinaryConfig !== 'undefined' ? cloudinaryConfig.uploadPreset : '') || '').trim();
    if (!cloudName || !uploadPreset) {
      adminToast('প্রথমে Settings এ Cloudinary Config সেভ করুন', 'error');
      try { showPage('settings'); } catch (e) {}
      return;
    }
    if (!Array.isArray(bannerItems) || !bannerItems[i]) {
      adminToast('ব্যানার আইটেম পাওয়া যায়নি, পেজ রিফ্রেশ করে আবার চেষ্টা করুন', 'error');
      return;
    }
    const input = document.createElement('input');
    input.type = 'file';
    input.accept = 'image/*';
    input.style.display = 'none';
    document.body.appendChild(input);
    input.onchange = async (e) => {
      const file = e.target.files && e.target.files[0];
      if (!file) { input.remove(); return; }
      // Soft size warning (does not block — Cloudinary will compress)
      const maxBytes = (which === 'mobile') ? (1024 * 1024) : (2 * 1024 * 1024);
      if (file.size > maxBytes) {
        adminToast('ফাইলটি বেশ বড়, আপলোড হতে সময় লাগতে পারে', 'success');
      }
      const fd = new FormData();
      fd.append('file', file);
      fd.append('upload_preset', uploadPreset);
      try {
        adminToast('আপলোড হচ্ছে...', 'success');
        const r = await fetch('https://api.cloudinary.com/v1_1/' + encodeURIComponent(cloudName) + '/image/upload', { method: 'POST', body: fd });
        const data = await r.json();
        if (data && data.secure_url) {
          if (which === 'desktop') {
            bannerItems[i].desktopUrl = data.secure_url;
            const inp = document.getElementById('bannerDesk_' + i);
            if (inp) inp.value = data.secure_url;
          } else {
            bannerItems[i].mobileUrl = data.secure_url;
            const inp = document.getElementById('bannerMob_' + i);
            if (inp) inp.value = data.secure_url;
          }
          renderBannersList();
          adminToast('আপলোড সফল ✅ — এখন "সংরক্ষণ করুন" বাটনে ক্লিক করুন', 'success');
        } else {
          const msg = (data && data.error && data.error.message) ? data.error.message : 'আপলোড ব্যর্থ — Cloudinary preset "Unsigned" কিনা যাচাই করুন';
          adminToast(msg, 'error');
        }
      } catch (err) {
        adminToast(__cldExplainError(err), 'error');
      } finally {
        input.remove();
      }
    };
    input.click();
  }

  function saveBanners() {
    const speedInput = document.getElementById('bannerSpeed');
    let speed = parseInt(speedInput && speedInput.value, 10);
    if (!speed || speed < 1500) speed = 5000;

    const clean = bannerItems
      .map((it, idx) => ({
        desktopUrl: String(it.desktopUrl || '').trim(),
        mobileUrl:  String(it.mobileUrl  || '').trim(),
        linkType:   String(it.linkType   || 'none'),
        linkTarget: String(it.linkTarget || '').trim(),
        customUrl:  String(it.customUrl  || '').trim(),
        alt:        String(it.alt        || '').trim(),
        enabled:    it.enabled !== false,
        order:      Number(it.order) || (idx + 1)
      }))
      .filter(it => it.desktopUrl || it.mobileUrl);

    db.collection('settings').doc('banners').set({
      speed: speed,
      items: clean,
      updatedAt: firebase.firestore.FieldValue.serverTimestamp()
    }, { merge: true })
      .then(() => adminToast('ব্যানার সংরক্ষণ হয়েছে ✅', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // Expose to inline handlers
  window.addBannerItem    = addBannerItem;
  window.removeBannerItem = removeBannerItem;
  window.moveBannerUp     = moveBannerUp;
  window.moveBannerDown   = moveBannerDown;
  window.uploadBannerImage= uploadBannerImage;
  window.bannerPreview    = bannerPreview;
  window.saveBanners      = saveBanners;
  window.renderBannersList= renderBannersList;

  // ===================== REVIEWS =======================
  let reviewsCache = [];
  function listenReviews() {
    db.collection('reviews').onSnapshot(snap => {
      reviewsCache = snap.docs.map(d => ({ id: d.id, ...d.data() }));
      reviewsCache.sort((a,b) => {
        const am = a.createdAt && a.createdAt.toMillis ? a.createdAt.toMillis() : 0;
        const bm = b.createdAt && b.createdAt.toMillis ? b.createdAt.toMillis() : 0;
        return bm - am;
      });
      renderReviewsList();
    }, err => console.error('reviews', err));
  }
  function renderReviewsList() {
    const el = document.getElementById('reviewsList');
    if (!el) return;
    if (!reviewsCache.length) {
      el.innerHTML = '<p style="color:#94a3b8;">এখনও কোনো রিভিউ নেই।</p>';
      return;
    }
    el.innerHTML = `<table class="product-table"><thead><tr><th>নাম</th><th>লোকেশন</th><th>রেটিং</th><th>ধরন</th><th>টেক্সট</th><th>তারিখ</th><th>অ্যাকশন</th></tr></thead><tbody>` +
      reviewsCache.map(r => `<tr>
        <td>${escHTML(r.name || '—')}</td>
        <td>${escHTML(r.location || '—')}</td>
        <td>${'⭐'.repeat(Math.max(1, Math.min(5, parseInt(r.rating) || 5)))}</td>
        <td><span style="display:inline-block;padding:3px 8px;border-radius:10px;font-size:0.75rem;font-weight:700;background:${r.source === 'website-homepage' ? '#d1fae5' : '#eef2ff'};color:${r.source === 'website-homepage' ? '#065f46' : '#4338ca'};">${r.source === 'website-homepage' ? 'ওয়েবসাইট' : 'ম্যানুয়াল'}</span></td>
        <td style="max-width:340px;">${escHTML((r.text || '').slice(0, 120))}${(r.text || '').length > 120 ? '…' : ''}</td>
        <td>${fmtTs(r.createdAt)}</td>
        <td>
          <button class="btn btn-outline btn-sm" onclick="openReviewModal('${attr(r.id)}')"><i class="fas fa-edit"></i></button>
          <button class="btn btn-danger btn-sm" onclick="askDeleteReview('${attr(r.id)}')"><i class="fas fa-trash"></i></button>
        </td>
      </tr>`).join('') + `</tbody></table>`;
  }
  function openReviewModal(id) {
    document.getElementById('reviewModalTitle').textContent = id ? 'রিভিউ এডিট করুন' : 'নতুন রিভিউ';
    document.getElementById('rvId').value = id || '';
    const r = id ? reviewsCache.find(x => x.id === id) : null;
    document.getElementById('rvName').value   = r ? (r.name || '') : '';
    document.getElementById('rvLoc').value    = r ? (r.location || '') : '';
    document.getElementById('rvAvatar').value = r ? (r.avatar || '') : '';
    document.getElementById('rvRating').value = r ? (parseInt(r.rating) || 5) : 5;
    document.getElementById('rvText').value   = r ? (r.text || '') : '';
    document.getElementById('reviewModal').classList.add('open');
  }
  function saveReview() {
    const id = document.getElementById('rvId').value;
    const data = {
      name: document.getElementById('rvName').value.trim(),
      location: document.getElementById('rvLoc').value.trim(),
      avatar: document.getElementById('rvAvatar').value.trim(),
      rating: Math.max(1, Math.min(5, parseInt(document.getElementById('rvRating').value) || 5)),
      text: document.getElementById('rvText').value.trim()
    };
    if (!data.name || !data.text) { adminToast('নাম ও রিভিউ টেক্সট দিন', 'error'); return; }
    const p = id
      ? db.collection('reviews').doc(id).update(data)
      : db.collection('reviews').add({ ...data, source: 'admin-manual', createdAt: firebase.firestore.FieldValue.serverTimestamp() });
    p.then(() => {
      document.getElementById('reviewModal').classList.remove('open');
      adminToast('সংরক্ষণ হয়েছে', 'success');
    }).catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }
  function askDeleteReview(id) {
    confirmModal('এই রিভিউটি মুছে ফেলতে চান?', () => {
      db.collection('reviews').doc(id).delete()
        .then(() => adminToast('মুছে ফেলা হয়েছে', 'success'))
        .catch(e => { console.error(e); adminToast('মুছতে ব্যর্থ', 'error'); });
    });
  }

  // ===================== গ্রাহকদের রিভিউ (Product Reviews from users) =======================
  let productReviewsCache = []; // all docs from productReviews collection
  let allProductsCache = [];    // snapshot of products for dropdown

  function listenProductReviewsPanel() {
    db.collection('productReviews').orderBy('createdAt', 'desc').onSnapshot(snap => {
      productReviewsCache = snap.docs.map(d => ({ id: d.id, ...d.data() }));
      renderProductReviewsPanel();
    }, err => {
      // If orderBy fails (no index), fallback without ordering
      db.collection('productReviews').onSnapshot(snap2 => {
        productReviewsCache = snap2.docs.map(d => ({ id: d.id, ...d.data() }));
        productReviewsCache.sort((a, b) => {
          const am = a.createdAt && a.createdAt.toMillis ? a.createdAt.toMillis() : 0;
          const bm = b.createdAt && b.createdAt.toMillis ? b.createdAt.toMillis() : 0;
          return bm - am;
        });
        renderProductReviewsPanel();
      }, err2 => console.error('productReviews', err2));
    });
  }

  function populateAdminReviewProductDropdown() {
    const sel = document.getElementById('adminReviewProductAdmin');
    if (!sel) return;
    const prev = sel.value;
    sel.innerHTML = '<option value="">— পণ্য নির্বাচন করুন —</option>' +
      allProductsCache.map(p => `<option value="${escHTML(p.id)}">${escHTML(p.title || p.id)}</option>`).join('');
    if (prev) sel.value = prev;
  }

  function renderProductReviewsPanel() {
    const wrap = document.getElementById('adminProductReviewsListPanel');
    if (!wrap) return;

    populateAdminReviewProductDropdown();

    if (!allProductsCache.length) {
      wrap.innerHTML = '<p style="color:#94a3b8;">পণ্য লোড হচ্ছে...</p>';
      return;
    }

    // Group reviews by productId
    const grouped = {};
    productReviewsCache.forEach(r => {
      const pid = r.productId || '__unknown__';
      if (!grouped[pid]) grouped[pid] = [];
      grouped[pid].push(r);
    });

    const products = allProductsCache;
    if (!products.length) {
      wrap.innerHTML = '<p style="color:#94a3b8;">কোনো পণ্য নেই।</p>';
      return;
    }

    wrap.innerHTML = products.map(p => {
      const pid = p.id;
      const list = grouped[pid] || [];
      const firstChar = (name) => {
        if (!name) return '🙂';
        const str = String(name).trim();
        return str ? (Array.from(str)[0] || '🙂') : '🙂';
      };
      const items = list.length
        ? list.map(r => `
          <div style="display:flex;gap:10px;padding:10px;border:1px solid #e5e7eb;border-radius:8px;background:#fff;margin-bottom:8px;align-items:flex-start;">
            <div style="width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#6c63ff,#ff6b6b);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0;font-size:1rem;">
              ${escHTML(firstChar(r.name))}
            </div>
            <div style="flex:1;min-width:0;">
              <div style="font-weight:600;color:#1f2937;">${escHTML(r.name || 'ক্রেতা')} <span style="color:#6b7280;font-weight:400;font-size:0.82rem;">• ${escHTML(r.loc || '')}</span></div>
              <div style="font-size:0.82rem;color:#f59e0b;">${'⭐'.repeat(Math.max(1,Math.min(5,parseInt(r.rating,10)||5)))}</div>
              <div style="color:#374151;font-size:0.88rem;margin-top:4px;">${escHTML(r.text || '')}</div>
              ${r.source === 'admin-manual' ? '<div style="display:inline-block;margin-top:5px;font-size:0.7rem;padding:2px 8px;background:#eef2ff;color:#4338ca;border-radius:10px;">ম্যানুয়াল</div>' : ''}
              <div style="color:#94a3b8;font-size:0.75rem;margin-top:3px;">${fmtTs(r.createdAt)}</div>
            </div>
            <button onclick="deleteProductReviewPanel('${attr(r.id)}')" title="মুছুন" style="background:#fee2e2;color:#dc2626;border:none;width:32px;height:32px;border-radius:6px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;">
              <i class="fas fa-trash"></i>
            </button>
          </div>`).join('')
        : '<div style="color:#9ca3af;font-size:0.88rem;padding:8px;">কোনো রিভিউ নেই।</div>';

      return `
        <details style="margin-bottom:10px;border:1px solid #e5e7eb;border-radius:10px;background:#f9fafb;">
          <summary style="cursor:pointer;padding:12px 14px;font-weight:600;color:#1f2937;display:flex;justify-content:space-between;align-items:center;list-style:none;">
            <span>${escHTML(p.title || p.id)}</span>
            <span style="background:#e0e7ff;color:#4338ca;font-size:0.75rem;padding:2px 8px;border-radius:10px;flex-shrink:0;margin-left:8px;">${list.length} রিভিউ</span>
          </summary>
          <div style="padding:10px 14px 14px;">${items}</div>
        </details>`;
    }).join('');
  }

  function deleteProductReviewPanel(reviewId) {
    if (!reviewId) return;
    confirmModal('এই রিভিউটি মুছে ফেলতে চান?', () => {
      db.collection('productReviews').doc(reviewId).delete()
        .then(() => adminToast('রিভিউ মুছে ফেলা হয়েছে', 'success'))
        .catch(e => { console.error(e); adminToast('মুছতে ব্যর্থ', 'error'); });
    });
  }

  async function adminAddManualReviewPanel() {
    const sel  = document.getElementById('adminReviewProductAdmin');
    const name = document.getElementById('adminReviewNameAdmin');
    const loc  = document.getElementById('adminReviewLocAdmin');
    const text = document.getElementById('adminReviewTextAdmin');
    const rat  = document.getElementById('adminReviewRatingAdmin');
    const msg  = document.getElementById('adminReviewMsgPanel');
    if (!sel || !name || !loc || !text) return;
    const pid = sel.value;
    if (!pid) { msg.style.color = '#dc2626'; msg.textContent = 'একটি পণ্য নির্বাচন করুন।'; return; }
    const nm = (name.value || '').trim();
    const lc = (loc.value  || '').trim();
    const tx = (text.value || '').trim();
    const rt = parseInt((rat && rat.value) || '5', 10) || 5;
    if (!nm || !lc || !tx) { msg.style.color = '#dc2626'; msg.textContent = 'সকল ফিল্ড পূরণ করুন।'; return; }
    const product = allProductsCache.find(p => p.id === pid);
    try {
      msg.style.color = '#6b7280'; msg.textContent = 'যোগ করা হচ্ছে...';
      await db.collection('productReviews').add({
        productId: String(pid),
        productTitle: (product && product.title) || '',
        name: nm, loc: lc, text: tx,
        rating: Math.max(1, Math.min(5, rt)),
        source: 'admin-manual',
        createdAt: firebase.firestore.FieldValue.serverTimestamp()
      });
      name.value = ''; loc.value = ''; text.value = '';
      msg.style.color = '#059669'; msg.textContent = 'রিভিউটি যোগ করা হয়েছে।';
      setTimeout(() => { if (msg) msg.textContent = ''; }, 3000);
    } catch (err) {
      console.error('adminAddManualReviewPanel', err);
      msg.style.color = '#dc2626'; msg.textContent = 'যোগ করা যায়নি: ' + (err && err.message ? err.message : '');
    }
  }

  // ===================== SUBSCRIBERS =======================
  let subscribersCache = [];
  function listenSubscribers() {
    db.collection('subscribers').onSnapshot(snap => {
      subscribersCache = snap.docs.map(d => ({ id: d.id, ...d.data() }));
      subscribersCache.sort((a,b) => {
        const am = a.createdAt && a.createdAt.toMillis ? a.createdAt.toMillis() : 0;
        const bm = b.createdAt && b.createdAt.toMillis ? b.createdAt.toMillis() : 0;
        return bm - am;
      });
      const c = document.getElementById('subscribersCount');
      if (c) c.textContent = subscribersCache.length;
      renderSubscribersTable();
    }, err => console.error('subscribers', err));
  }
  function renderSubscribersTable() {
    const el = document.getElementById('subscribersTable');
    if (!el) return;
    if (!subscribersCache.length) {
      el.innerHTML = '<p style="color:#94a3b8;">এখনও কোনো সাবস্ক্রাইবার নেই।</p>';
      return;
    }
    el.innerHTML = `<table class="product-table"><thead><tr><th>#</th><th>ইমেইল</th><th>সাবস্ক্রিপশন তারিখ</th><th>অ্যাকশন</th></tr></thead><tbody>` +
      subscribersCache.map((s, i) => `<tr>
        <td>${i+1}</td>
        <td><a href="mailto:${attr(s.email)}" style="color:var(--primary);text-decoration:none;">${escHTML(s.email || '—')}</a></td>
        <td>${fmtTs(s.createdAt)}</td>
        <td>
          <button class="btn btn-outline btn-sm" onclick="copyOneSubscriber('${attr(s.email || '')}')"><i class="fas fa-copy"></i></button>
          <button class="btn btn-danger btn-sm" onclick="askDeleteSubscriber('${attr(s.id)}')"><i class="fas fa-trash"></i></button>
        </td>
      </tr>`).join('') + `</tbody></table>`;
  }
  function copyOneSubscriber(email) {
    navigator.clipboard.writeText(email).then(() => adminToast('কপি হয়েছে', 'success'));
  }
  function copyAllSubscribers() {
    const list = subscribersCache.map(s => s.email).filter(Boolean).join(', ');
    if (!list) { adminToast('কপি করার মতো কিছু নেই', 'error'); return; }
    navigator.clipboard.writeText(list).then(() => adminToast('সব ইমেইল কপি হয়েছে', 'success'));
  }
  function exportSubscribersCSV() {
    if (!subscribersCache.length) { adminToast('কোনো ডেটা নেই', 'error'); return; }
    const rows = [['email','subscribedAt']].concat(subscribersCache.map(s => [s.email || '', fmtTs(s.createdAt)]));
    const csv = rows.map(r => r.map(v => '"' + String(v).replace(/"/g, '""') + '"').join(',')).join('\n');
    const blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
    const a = document.createElement('a');
    a.href = URL.createObjectURL(blob);
    a.download = 'subscribers.csv';
    document.body.appendChild(a); a.click(); document.body.removeChild(a);
  }
  function askDeleteSubscriber(id) {
    confirmModal('এই সাবস্ক্রাইবারটি মুছে ফেলতে চান?', () => {
      db.collection('subscribers').doc(id).delete()
        .then(() => adminToast('মুছে ফেলা হয়েছে', 'success'))
        .catch(e => { console.error(e); adminToast('মুছতে ব্যর্থ', 'error'); });
    });
  }

  // ===================== QUICK LINKS =======================
  let quickLinkItems = [];
  let cachedProductOptions = [];
  function listenQuickLinks() {
    db.collection('settings').doc('quicklinks').onSnapshot(snap => {
      const data = snap.exists ? snap.data() : null;
      quickLinkItems = (data && Array.isArray(data.items)) ? data.items.map(it => ({
        label: it.label || '', type: it.type || 'home', target: it.target || '', icon: it.icon || 'fas fa-chevron-right'
      })) : [];
      renderQuickLinks();
    }, err => console.error('quicklinks', err));
  }
  function renderQuickLinks() {
    const list = document.getElementById('quickLinksList');
    if (!list) return;
    // Build product options snapshot for the "product" type select
    cachedProductOptions = (window.allProducts || []).map(p => ({ id: p.id, title: p.title || 'Untitled' }));
    if (!quickLinkItems.length) {
      list.innerHTML = '<p style="color:#94a3b8;font-size:0.9rem;">এখনও কোনো লিংক নেই।</p>';
      return;
    }
    const typeOpts = [
      ['home','হোম'], ['shop','শপ'], ['offers','অফার'], ['new','নতুন পণ্য'],
      ['about','আমাদের সম্পর্কে'], ['contact','যোগাযোগ'],
      ['category','ক্যাটাগরি'], ['product','পণ্য'], ['url','URL']
    ];
    list.innerHTML = quickLinkItems.map((it, i) => {
      const opts = typeOpts.map(o => `<option value="${o[0]}" ${it.type === o[0] ? 'selected':''}>${o[1]}</option>`).join('');
      let targetField = '';
      if (it.type === 'category') {
        targetField = `<input class="form-control" type="text" value="${attr(it.target)}" placeholder="ক্যাটাগরি key (যেমন: smartphone)" oninput="quickLinkItems[${i}].target = this.value" />`;
      } else if (it.type === 'product') {
        const prodOptions = `<option value="">— পণ্য নির্বাচন —</option>` +
          cachedProductOptions.map(p => `<option value="${attr(p.id)}" ${p.id === it.target ? 'selected':''}>${escHTML(p.title)}</option>`).join('');
        targetField = `<select class="form-control" onchange="quickLinkItems[${i}].target = this.value">${prodOptions}</select>`;
      } else if (it.type === 'url') {
        targetField = `<input class="form-control" type="text" value="${attr(it.target)}" placeholder="https://example.com" oninput="quickLinkItems[${i}].target = this.value" />`;
      } else {
        targetField = `<input class="form-control" type="text" disabled value="(কোনো টার্গেট প্রয়োজন নেই)" />`;
      }
      return `<div style="border:1px solid #e2e8f0;border-radius:10px;padding:12px;background:#f8fafc;">
        <div class="form-grid">
          <div class="form-group">
            <label class="form-label">লেবেল</label>
            <input class="form-control" type="text" value="${attr(it.label)}" oninput="quickLinkItems[${i}].label = this.value" />
          </div>
          <div class="form-group">
            <label class="form-label">আইকন (FA class)</label>
            <input class="form-control" type="text" value="${attr(it.icon)}" oninput="quickLinkItems[${i}].icon = this.value" placeholder="fas fa-chevron-right" />
          </div>
          <div class="form-group">
            <label class="form-label">টাইপ</label>
            <select class="form-control" onchange="quickLinkItems[${i}].type = this.value; quickLinkItems[${i}].target=''; renderQuickLinks();">${opts}</select>
          </div>
          <div class="form-group">
            <label class="form-label">টার্গেট</label>
            ${targetField}
          </div>
        </div>
        <div style="margin-top:8px;display:flex;justify-content:space-between;gap:8px;">
          <div>
            <button class="btn btn-outline btn-sm" onclick="moveQuickLink(${i}, -1)"><i class="fas fa-arrow-up"></i></button>
            <button class="btn btn-outline btn-sm" onclick="moveQuickLink(${i}, 1)"><i class="fas fa-arrow-down"></i></button>
          </div>
          <button class="btn btn-danger btn-sm" onclick="removeQuickLink(${i})"><i class="fas fa-trash"></i> মুছুন</button>
        </div>
      </div>`;
    }).join('');
  }
  function addQuickLink() { quickLinkItems.push({ label:'', type:'home', target:'', icon:'fas fa-chevron-right' }); renderQuickLinks(); }
  function removeQuickLink(i) { quickLinkItems.splice(i, 1); renderQuickLinks(); }
  function moveQuickLink(i, dir) {
    const j = i + dir;
    if (j < 0 || j >= quickLinkItems.length) return;
    const tmp = quickLinkItems[i]; quickLinkItems[i] = quickLinkItems[j]; quickLinkItems[j] = tmp;
    renderQuickLinks();
  }
  function saveQuickLinks() {
    const clean = quickLinkItems.filter(it => it.label && it.type).map(it => ({
      label: String(it.label).trim(),
      type: String(it.type).trim(),
      target: String(it.target || '').trim(),
      icon: String(it.icon || 'fas fa-chevron-right').trim()
    }));
    db.collection('settings').doc('quicklinks').set({ items: clean, updatedAt: firebase.firestore.FieldValue.serverTimestamp() }, { merge: true })
      .then(() => adminToast('কুইক লিংক সংরক্ষণ হয়েছে', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // ===================== CATEGORIES =======================
  let categoriesCache = [];
  // Default categories that match the website's built-in CATEGORY_META.
  // Seeded into Firestore on first load so they show up in the admin list
  // and can be edited / re-ordered / deleted by the user.
  const DEFAULT_CATEGORIES = [
    { key: 'smartphone',  label: 'স্মার্টফোন',     icon: 'fas fa-mobile-alt',    order: 10 },
    { key: 'earphone',    label: 'ইয়ারফোন',       icon: 'fas fa-headphones',    order: 20 },
    { key: 'smartwatch',  label: 'স্মার্টওয়াচ',     icon: 'fas fa-clock',         order: 30 },
    { key: 'onyo',        label: 'অনন্য',          icon: 'fas fa-star',          order: 40 },
    { key: 'laptop',      label: 'ল্যাপটপ',        icon: 'fas fa-laptop',        order: 50 },
    { key: 'gaming',      label: 'গেমিং',          icon: 'fas fa-gamepad',       order: 60 },
    { key: 'camera',      label: 'ক্যামেরা',        icon: 'fas fa-camera',        order: 70 },
    { key: 'charger',     label: 'চার্জার',         icon: 'fas fa-bolt',          order: 80 },
    { key: 'tablet',      label: 'ট্যাবলেট',       icon: 'fas fa-tablet-alt',    order: 90 },
    { key: 'accessories', label: 'অ্যাক্সেসরিজ',   icon: 'fas fa-puzzle-piece',  order: 100 },
    { key: 'other',       label: 'অন্যান্য',       icon: 'fas fa-box',           order: 110 }
  ];
  let _defaultsSeeded = false;
  function seedDefaultCategoriesIfMissing(existing) {
    if (_defaultsSeeded) return;
    _defaultsSeeded = true; // guard against repeat snapshot fires
    const existingKeys = new Set(existing.map(c => String(c.key || '').toLowerCase().trim()));
    const missing = DEFAULT_CATEGORIES.filter(c => !existingKeys.has(c.key));
    if (!missing.length) return;
    // Use the category key as the doc ID so each default is a stable upsert
    // (no duplicates if seeding ever runs more than once).
    const batch = db.batch();
    missing.forEach(c => {
      const ref = db.collection('categories').doc(c.key);
      batch.set(ref, c, { merge: true });
    });
    batch.commit()
      .then(() => console.log('Seeded default categories:', missing.map(c => c.key).join(', ')))
      .catch(e => console.warn('Default category seed failed', e));
  }
  function listenCategories() {
    db.collection('categories').onSnapshot(snap => {
      categoriesCache = snap.docs.map(d => ({ id: d.id, ...d.data() }));
      categoriesCache.sort((a,b) => (parseInt(a.order)||0) - (parseInt(b.order)||0));
      // First snapshot: ensure all website defaults exist in Firestore so
      // they're visible & editable in the admin's Categories section.
      seedDefaultCategoriesIfMissing(categoriesCache);
      renderCategoriesList();
      populateProductCategorySelect();
    }, err => console.error('categories', err));
  }

  // Fill the "Add/Edit Product" category <select> from categoriesCache.
  // Preserves the currently-selected value so it survives live updates.
  function populateProductCategorySelect() {
    const sel = document.getElementById('pCategory');
    if (!sel) return;
    const prev = sel.value;
    const opts = ['<option value="">— ক্যাটাগরি নির্বাচন করুন —</option>']
      .concat(categoriesCache.map(c =>
        `<option value="${attr(c.key || '')}">${escHTML(c.label || c.key || '')}</option>`
      ));
    // If the previously-selected value isn't in the list, keep it as a fallback
    // option so editing an old product doesn't silently lose its category.
    if (prev && !categoriesCache.some(c => (c.key || '') === prev)) {
      opts.push(`<option value="${attr(prev)}" selected>${escHTML(prev)} (পুরনো)</option>`);
    }
    sel.innerHTML = opts.join('');
    if (prev) sel.value = prev;
  }
  function renderCategoriesList() {
    const el = document.getElementById('categoriesList');
    if (!el) return;
    if (!categoriesCache.length) {
      el.innerHTML = '<p style="color:#94a3b8;">এখনও কোনো ক্যাটাগরি নেই। ডিফল্ট সেট ব্যবহার হচ্ছে।</p>';
      return;
    }
    el.innerHTML = `<table class="product-table"><thead><tr><th>আইকন</th><th>Key</th><th>লেবেল</th><th>অর্ডার</th><th>অ্যাকশন</th></tr></thead><tbody>` +
      categoriesCache.map(c => `<tr>
        <td><i class="${attr(c.icon || 'fas fa-tag')}" style="font-size:1.1rem;color:var(--primary);"></i></td>
        <td><code>${escHTML(c.key || '—')}</code></td>
        <td>${escHTML(c.label || '—')}</td>
        <td>${escHTML(c.order != null ? c.order : '—')}</td>
        <td>
          <button class="btn btn-outline btn-sm" onclick="openCategoryModal('${attr(c.id)}')"><i class="fas fa-edit"></i></button>
          <button class="btn btn-danger btn-sm" onclick="askDeleteCategory('${attr(c.id)}')"><i class="fas fa-trash"></i></button>
        </td>
      </tr>`).join('') + `</tbody></table>`;
  }
  function openCategoryModal(id) {
    document.getElementById('categoryModalTitle').textContent = id ? 'ক্যাটাগরি এডিট' : 'নতুন ক্যাটাগরি';
    document.getElementById('catId').value = id || '';
    const c = id ? categoriesCache.find(x => x.id === id) : null;
    document.getElementById('catKey').value   = c ? (c.key || '') : '';
    document.getElementById('catLabel').value = c ? (c.label || '') : '';
    document.getElementById('catIcon').value  = c ? (c.icon || 'fas fa-tag') : 'fas fa-tag';
    document.getElementById('catOrder').value = c && c.order != null ? c.order : 10;
    document.getElementById('categoryModal').classList.add('open');
  }
  function saveCategory() {
    const id = document.getElementById('catId').value;
    const data = {
      key:   document.getElementById('catKey').value.trim().toLowerCase().replace(/\s+/g, ''),
      label: document.getElementById('catLabel').value.trim(),
      icon:  document.getElementById('catIcon').value.trim() || 'fas fa-tag',
      order: parseInt(document.getElementById('catOrder').value) || 10
    };
    if (!data.key || !data.label) { adminToast('Key ও লেবেল দিন', 'error'); return; }
    const p = id
      ? db.collection('categories').doc(id).update(data)
      : db.collection('categories').add(data);
    p.then(() => {
      document.getElementById('categoryModal').classList.remove('open');
      adminToast('সংরক্ষণ হয়েছে', 'success');
    }).catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }
  function askDeleteCategory(id) {
    confirmModal('এই ক্যাটাগরি মুছে ফেলতে চান? এর সাথে যুক্ত পণ্যগুলো শপে "অন্যান্য" এ চলে যাবে।', () => {
      db.collection('categories').doc(id).delete()
        .then(() => adminToast('মুছে ফেলা হয়েছে', 'success'))
        .catch(e => { console.error(e); adminToast('মুছতে ব্যর্থ', 'error'); });
    });
  }

  // ===================== RESELLER HELP CENTER =======================
  function listenResellerHelpCenter() {
    db.collection('settings').doc('resellerHelpCenter').onSnapshot(snap => {
      const h = snap.exists ? snap.data() : {};
      const set = (id, val) => { const el = document.getElementById(id); if (el && document.activeElement !== el) el.value = val || ''; };
      set('rhcHotline',  h.hotline);
      set('rhcHours',    h.hours);
      set('rhcWhatsapp', h.whatsapp);
      set('rhcEmail',    h.email);
      set('rhcTelegram', h.telegramUsername);
      set('rhcFacebook', h.facebookGroupUrl);
    }, err => console.error('resellerHelpCenter', err));
  }
  function saveResellerHelpCenter() {
    const data = {
      hotline:          document.getElementById('rhcHotline').value.trim(),
      hours:            document.getElementById('rhcHours').value.trim(),
      whatsapp:         document.getElementById('rhcWhatsapp').value.trim(),
      email:            document.getElementById('rhcEmail').value.trim(),
      telegramUsername: document.getElementById('rhcTelegram').value.trim().replace(/^@/, ''),
      facebookGroupUrl: document.getElementById('rhcFacebook').value.trim(),
      updatedAt: firebase.firestore.FieldValue.serverTimestamp()
    };
    db.collection('settings').doc('resellerHelpCenter').set(data, { merge: true })
      .then(() => adminToast('রিসেলার হেল্প সেন্টার তথ্য সংরক্ষণ হয়েছে', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // ===================== RESELLER LEGAL PAGES (Terms & Privacy) =======================
  // Persists to settings/resellerLegalPages document — সম্পূর্ণ আলাদা মূল ওয়েবসাইটের
  // settings/legalPages থেকে, শুধু রিসেলার অ্যাপে ব্যবহার হয়।
  function listenResellerLegalPages() {
    db.collection('settings').doc('resellerLegalPages').onSnapshot(snap => {
      const d = snap.exists ? snap.data() : {};
      const set = (id, val) => { const el = document.getElementById(id); if (el && document.activeElement !== el) el.value = val || ''; };
      set('rlpTermsTitle',     d.termsTitle);
      set('rlpTermsContent',   d.termsContent);
      set('rlpPrivacyTitle',   d.privacyTitle);
      set('rlpPrivacyContent', d.privacyContent);
    }, err => console.error('resellerLegalPages', err));
  }
  function saveResellerLegalPage(kind) {
    const map = {
      terms:   { titleId: 'rlpTermsTitle',   contentId: 'rlpTermsContent',   label: 'শর্তাবলী' },
      privacy: { titleId: 'rlpPrivacyTitle', contentId: 'rlpPrivacyContent', label: 'গোপনীয়তা নীতি' }
    };
    const cfg = map[kind];
    if (!cfg) return;
    const payload = {};
    payload[kind + 'Title']   = document.getElementById(cfg.titleId).value.trim() || cfg.label;
    payload[kind + 'Content'] = document.getElementById(cfg.contentId).value;
    payload.updatedAt = firebase.firestore.FieldValue.serverTimestamp();
    db.collection('settings').doc('resellerLegalPages').set(payload, { merge: true })
      .then(() => adminToast(cfg.label + ' সংরক্ষণ হয়েছে', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // ===================== CONTACT INFO =======================
  function listenContactInfo() {
    db.collection('settings').doc('contact').onSnapshot(snap => {
      const c = snap.exists ? snap.data() : {};
      const set = (id, val) => { const el = document.getElementById(id); if (el && document.activeElement !== el) el.value = val || ''; };
      set('ciAddress', c.address);
      set('ciPhone',   c.phone);
      set('ciPhone2',  c.phone2);
      set('ciEmail',   c.email);
      set('ciEmail2',  c.email2);
      set('ciHours',   c.hours);
    }, err => console.error('contact', err));
  }
  function saveContactInfo() {
    const data = {
      address: document.getElementById('ciAddress').value.trim(),
      phone:   document.getElementById('ciPhone').value.trim(),
      phone2:  document.getElementById('ciPhone2').value.trim(),
      email:   document.getElementById('ciEmail').value.trim(),
      email2:  document.getElementById('ciEmail2').value.trim(),
      hours:   document.getElementById('ciHours').value.trim(),
      updatedAt: firebase.firestore.FieldValue.serverTimestamp()
    };
    db.collection('settings').doc('contact').set(data, { merge: true })
      .then(() => adminToast('যোগাযোগ তথ্য সংরক্ষণ হয়েছে', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // ===================== ABOUT PAGE =======================
  function listenAboutPage() {
    db.collection('settings').doc('about').onSnapshot(snap => {
      const a = snap.exists ? snap.data() : {};
      const t = document.getElementById('aboutPageTitle');
      const c = document.getElementById('aboutPageContent');
      if (t && document.activeElement !== t) t.value = a.title || 'আমাদের সম্পর্কে';
      if (c && document.activeElement !== c) c.value = a.content || '';
    }, err => console.error('about', err));
  }
  function saveAboutPage() {
    const data = {
      title:   document.getElementById('aboutPageTitle').value.trim() || 'আমাদের সম্পর্কে',
      content: document.getElementById('aboutPageContent').value,
      updatedAt: firebase.firestore.FieldValue.serverTimestamp()
    };
    db.collection('settings').doc('about').set(data, { merge: true })
      .then(() => adminToast('সংরক্ষণ হয়েছে', 'success'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }

  // =====================================================================
  // ============ FIX 1: PRODUCT ORDERING (display order) ================
  // =====================================================================
  // Persists a numeric `displayOrder` field on each /products document.
  // The storefront sorts ascending by this number (lower first), falling
  // back to createdAt-desc when the field is missing.
  function renderProductOrderingList() {
    const list = document.getElementById('orderingList');
    if (!list) return;
    if (!Array.isArray(allProducts) || !allProducts.length) {
      list.innerHTML = '<p style="color:#94a3b8;">কোনো পণ্য নেই। আগে পণ্য যোগ করুন।</p>';
      return;
    }
    // Sort by current displayOrder so admin sees current order
    const sorted = [...allProducts].sort((a, b) => {
      const ao = (a.displayOrder === undefined || a.displayOrder === null) ? 9999 : Number(a.displayOrder);
      const bo = (b.displayOrder === undefined || b.displayOrder === null) ? 9999 : Number(b.displayOrder);
      if (ao !== bo) return ao - bo;
      return getDocSortTime(b.createdAt) - getDocSortTime(a.createdAt);
    });
    list.innerHTML = sorted.map((p, idx) => {
      const order = (p.displayOrder === undefined || p.displayOrder === null) ? (idx + 1) : p.displayOrder;
      const thumb = p.thumbnail
        ? `<img src="${escHTML(optimizeCloudinaryUrl(p.thumbnail))}" style="width:42px;height:42px;border-radius:8px;object-fit:cover;background:#f1f5f9;" onerror="this.style.display='none'" />`
        : `<div style="width:42px;height:42px;border-radius:8px;background:linear-gradient(135deg,#e0e7ff,#ede9fe);display:flex;align-items:center;justify-content:center;color:#7c3aed;"><i class="fas fa-box"></i></div>`;
      return `
        <div style="display:flex;gap:12px;align-items:center;padding:10px 12px;border:1px solid #e2e8f0;border-radius:10px;background:#fff;">
          ${thumb}
          <div style="flex:1;min-width:0;">
            <div style="font-weight:600;color:#1e293b;font-size:0.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;">${escHTML(p.title || '—')}</div>
            <div style="font-size:0.75rem;color:#64748b;">৳${Number(p.price || 0).toLocaleString()} · ${escHTML(catNames[p.category] || p.category || '—')}</div>
          </div>
          <div style="display:flex;align-items:center;gap:6px;">
            <label style="font-size:0.75rem;color:#64748b;">ক্রম</label>
            <input type="number" min="1" value="${order}" data-pid="${escHTML(p.id)}" class="ordering-input" style="width:80px;padding:6px 8px;border:1.5px solid #e2e8f0;border-radius:6px;font-size:0.9rem;text-align:center;" />
          </div>
        </div>`;
    }).join('');
  }

  async function saveProductOrdering() {
    const inputs = document.querySelectorAll('.ordering-input');
    if (!inputs.length) { adminToast('সংরক্ষণ করার মতো কিছু নেই', 'error'); return; }
    const batch = db.batch();
    inputs.forEach(input => {
      const pid = input.getAttribute('data-pid');
      const val = parseInt(input.value, 10);
      if (!pid || Number.isNaN(val)) return;
      batch.update(db.collection('products').doc(pid), { displayOrder: val });
    });
    try {
      await batch.commit();
      adminToast('ক্রম সংরক্ষণ হয়েছে ✅');
    } catch (e) {
      console.error(e);
      adminToast('সংরক্ষণ ব্যর্থ', 'error');
    }
  }

  // =====================================================================
  // ============ FIX 5: LEGAL PAGES (Privacy / Return / Terms) ==========
  // =====================================================================
  // Persists to settings/legalPages document with fields:
  //   privacyTitle, privacyContent, returnTitle, returnContent,
  //   termsTitle, termsContent
  function listenLegalPages() {
    db.collection('settings').doc('legalPages').onSnapshot(snap => {
      const d = snap.exists ? snap.data() : {};
      const set = (id, val) => { const el = document.getElementById(id); if (el) el.value = val || ''; };
      set('legalPrivacyTitle', d.privacyTitle || 'প্রাইভেসি পলিসি');
      set('legalPrivacyContent', d.privacyContent || '');
      set('legalReturnTitle', d.returnTitle || 'রিটার্ন পলিসি');
      set('legalReturnContent', d.returnContent || '');
      set('legalTermsTitle', d.termsTitle || 'শর্তাবলী');
      set('legalTermsContent', d.termsContent || '');
    }, err => console.warn('legalPages', err));
  }

  function saveLegalPage(kind) {
    const map = {
      privacy: { titleId: 'legalPrivacyTitle', contentId: 'legalPrivacyContent', label: 'প্রাইভেসি পলিসি' },
      return:  { titleId: 'legalReturnTitle',  contentId: 'legalReturnContent',  label: 'রিটার্ন পলিসি' },
      terms:   { titleId: 'legalTermsTitle',   contentId: 'legalTermsContent',   label: 'শর্তাবলী' }
    };
    const cfg = map[kind];
    if (!cfg) return;
    const payload = {};
    payload[kind + 'Title']   = document.getElementById(cfg.titleId).value.trim() || cfg.label;
    payload[kind + 'Content'] = document.getElementById(cfg.contentId).value;
    payload.updatedAt = firebase.firestore.FieldValue.serverTimestamp();
    db.collection('settings').doc('legalPages').set(payload, { merge: true })
      .then(() => adminToast(cfg.label + ' সংরক্ষণ হয়েছে ✅'))
      .catch(e => { console.error(e); adminToast('সংরক্ষণ ব্যর্থ', 'error'); });
  }
</script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v833ccba57c9e4d2798f2e76cebdd09a11778172276447" integrity="sha512-57MDmcccJXYtNnH+ZiBwzC4jb2rvgVCEokYN+L/nLlmO8rfYT/gIpW2A569iJ/3b+0UEasghjuZH/ma3wIs/EQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v4513226cdae34746b4dedf0b4dfa099e1781791509496" integrity="sha512-ZE9pZaUXND66v380QUtch/5sE9tPFh2zg45pR2PB0CVkCtOREv2AJKkSidISWkysEuQ0EH8faUU5du78bx87UQ==" data-cf-beacon='{"version":"2024.11.0","token":"75124c326cb447fe934cde04713ae013","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
</body>
</html>
