From c21738950ddfddc88045f733112b540732a7383c Mon Sep 17 00:00:00 2001
From: safavimohadeseh78 <safavimohadeseh78@gmail.com>
Date: Tue, 3 Nov 2026 13:04:09 +0330
Subject: [PATCH] feat(convert): show history and let customers edit pending
 requests

Desktop history sits beside the form. Pending requests can be updated or deleted, and the shared wallet surface drops its extra border and padding.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 .../abshode-domain-lookup/learned-notes.md    |   4 +
 src/api/copperConvert.ts                      |  31 +++++
 .../components/CopperConvertCalculator.vue    |  41 +++---
 .../components/CopperConvertHistory.vue       | 126 ++++++++++++++++++
 .../composables/useCopperConvertPage.ts       | 109 ++++++++++++++-
 .../convert/desktop/DesktopConvertView.vue    |  90 ++++---------
 .../base/convert/mobile/MobileConvertView.vue |   4 +-
 .../wallet/desktop/styles/desktop-wallet.less |   2 -
 8 files changed, 320 insertions(+), 87 deletions(-)
 create mode 100644 src/views/base/convert/components/CopperConvertHistory.vue

diff --git a/.cursor/skills/abshode-domain-lookup/learned-notes.md b/.cursor/skills/abshode-domain-lookup/learned-notes.md
index e0a7ea3..92a437a 100644
--- a/.cursor/skills/abshode-domain-lookup/learned-notes.md
+++ b/.cursor/skills/abshode-domain-lookup/learned-notes.md
@@ -62,3 +62,7 @@
 - 2026-11-02 | سه زبانه تبدیل از اول | همان `CopperConvertCalculator.vue` | زبانه ۱.۵ و ۲.۵ دیگر پشت `remainderAmount > 0` نیستند؛ زیر زبانه مقدار، قبل از نتیجه
 - 2026-11-02 | زبانه سیم مکمل | `useCopperConvertPage.ts` | بودجه = ارزش مقدار انتخاب‌شده؛ نصف به ۱.۵ و بقیه به ۲.۵؛ جابه‌جایی یکی دیگری را پر می‌کند
 - 2026-11-01 | تاریخچه برداشت کیف پول | `wallet/mobile/MobileWalletView.vue` + `desktop/DesktopWalletView.vue` + `useWalletPageData.ts` | `walletWithdrawItems` از قبل لود می‌شد؛ زیر راهنمای برداشت و زیر حساب‌های دسکتاپ نشان داده می‌شود
+- 2026-11-03 | تاریخچه تبدیل کاربر | `convert/components/CopperConvertHistory.vue` + `useCopperConvertPage.ts` + سرور `Customer/CopperConvertRequestController@index` | GET `/customer/copper-convert-request` فقط ردیف‌های همان مشتری؛ زیر فرم موبایل و دسکتاپ
+- 2026-11-03 | ویرایش/حذف تبدیل در انتظار | همان تاریخچه + `CopperConvertRequestService::update/remove` | فقط status=pending؛ ویرایش فرم را با همان حلقه‌ها پر می‌کند و PUT می‌زند
+- 2026-11-03 | چیدمان دسکتاپ تبدیل | `convert/desktop/DesktopConvertView.vue` | مثل کیف پول: `dwallet-grid`؛ فرم راست، تاریخچه چپ با `variant=side`
+- 2026-11-03 | مداد ویرایش تبدیل | `convert/components/CopperConvertHistory.vue` | فقط pending؛ آیکون `vuesax-linear:edit` کنار وضعیت، همان `beginEdit`
diff --git a/src/api/copperConvert.ts b/src/api/copperConvert.ts
index 5804cb6..1db59d2 100644
--- a/src/api/copperConvert.ts
+++ b/src/api/copperConvert.ts
@@ -1,6 +1,18 @@
 import useAxios from '@/utils/useAxios'
 import type { CopperConvertSource } from '@/utils/copperWireConvert'
 
+export interface CopperConvertHistoryRow {
+  id: number
+  status: string
+  source: string
+  asset_unit: string
+  consumed_amount: number
+  leftover_amount: number
+  wire15_rings: number
+  wire25_rings: number
+  created_at?: string
+}
+
 export function createCopperConvertRequest(payload: {
   source: CopperConvertSource
   rings15: number
@@ -8,3 +20,22 @@ export function createCopperConvertRequest(payload: {
 }) {
   return useAxios.post('/customer/copper-convert-request', payload)
 }
+
+export function getCopperConvertRequests() {
+  return useAxios.get<CopperConvertHistoryRow[]>('/customer/copper-convert-request')
+}
+
+export function updateCopperConvertRequest(
+  id: number,
+  payload: {
+    source: CopperConvertSource
+    rings15: number
+    rings25: number
+  },
+) {
+  return useAxios.put(`/customer/copper-convert-request/${id}`, payload)
+}
+
+export function deleteCopperConvertRequest(id: number) {
+  return useAxios.delete(`/customer/copper-convert-request/${id}`)
+}
diff --git a/src/views/base/convert/components/CopperConvertCalculator.vue b/src/views/base/convert/components/CopperConvertCalculator.vue
index ebf8b5d..041a74c 100644
--- a/src/views/base/convert/components/CopperConvertCalculator.vue
+++ b/src/views/base/convert/components/CopperConvertCalculator.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="copper-convert" dir="rtl">
-    <p class="copper-convert__lead">
-      مقدار کاتد، مفتول یا شمش از دارایی شما خوانده می‌شود. با زبانه از صفر تا همان موجودی انتخاب کنید. معادل مفتول و حلقه سیم ۱.۵ و ۲.۵ با قیمت روز حساب می‌شود.
-    </p>
+  <div class="copper-convert" data-convert-form dir="rtl">
 
     <a-spin :spinning="loading">
       <section class="copper-convert__panel" aria-label="قیمت‌های مبنا">
+      <p v-if="!result && amountAttempted && !loading" class="copper-convert__warn">
+        مقدار معتبر وارد کنید و از فعال بودن قیمت کاتد/مفتول در سامانه مطمئن شوید.
+      </p>
         <div class="copper-convert__panel-head">
           <span class="copper-convert__panel-kicker">قیمت لحظه‌ای</span>
           <span class="copper-convert__panel-title">مبنای محاسبه</span>
@@ -186,23 +186,28 @@
         <p class="copper-convert__asset-hint">
           از مقدار انتخاب‌شده، <span class="copper-convert__measure"><bdi>{{ assetUnit }}</bdi><bdi>{{ formatAssetAmount(leftoverAmount) }}</bdi></span> به حلقهٔ کامل نمی‌رسد و در دارایی می‌ماند. باقی دارایی که روی زبانه انتخاب نشده هم دست‌نخورده می‌ماند.
         </p>
-        <BasicButton
-          type="primary"
-          class="!w-full"
-          :loading="submitting"
-          :disabledB="wire15Rings + wire25Rings < 1"
-          @click="submitRequest"
-        >
-          ثبت درخواست تبدیل
-        </BasicButton>
+        <p v-if="editingId" class="copper-convert__asset-hint">
+          در حال ویرایش درخواست در انتظار تایید. ذخیره، همان درخواست را به‌روز می‌کند.
+        </p>
+        <div :class="editingId ? 'grid grid-cols-2 gap-2' : ''">
+          <BasicButton
+            type="primary"
+            class="!w-full"
+            html-type="button"
+            :loading="submitting"
+            :disabledB="wire15Rings + wire25Rings < 1"
+            @click="submitRequest"
+          >
+            {{ editingId ? 'ذخیره ویرایش' : 'ثبت درخواست تبدیل' }}
+          </BasicButton>
+          <BasicButton v-if="editingId" class="!w-full" html-type="button" :disabledB="submitting" @click="cancelEdit">
+            انصراف
+          </BasicButton>
+        </div>
         <p class="copper-convert__asset-hint">
           درخواست برای ادمین می‌رود. بعد از تأیید، همان مقدار دارایی فروخته و حلقه‌های انتخاب‌شده خریده می‌شود.
         </p>
       </section>
-
-      <p v-if="!result && amountAttempted && !loading" class="copper-convert__warn">
-        مقدار معتبر وارد کنید و از فعال بودن قیمت کاتد/مفتول در سامانه مطمئن شوید.
-      </p>
     </a-spin>
   </div>
 </template>
@@ -227,6 +232,8 @@ const {
   leftoverAmount,
   submitting,
   submitRequest,
+  editingId,
+  cancelEdit,
   result,
   priceRows,
 } = useCopperConvertPageContext()
diff --git a/src/views/base/convert/components/CopperConvertHistory.vue b/src/views/base/convert/components/CopperConvertHistory.vue
new file mode 100644
index 0000000..3696f08
--- /dev/null
+++ b/src/views/base/convert/components/CopperConvertHistory.vue
@@ -0,0 +1,126 @@
+<template>
+  <section
+    :class="side
+      ? 'flex min-h-0 min-w-0 flex-1 flex-col'
+      : 'mt-3 flex flex-col gap-2 rounded-xl border border-gray-200 bg-white p-2.5'"
+    aria-label="تاریخچه تبدیل"
+  >
+    <div :class="side ? 'dwallet-side__header' : ''">
+      <div>
+        <h2 :class="side ? 'dwallet-side__title' : 'm-0 text-sm font-bold text-slate-900'">تاریخچه تبدیل</h2>
+      </div>
+    </div>
+
+    <div :class="side ? 'dwallet-side__scroll' : ''">
+    <a-spin :spinning="historyLoading && !history.length">
+      <div v-if="historyLoading && !history.length" class="min-h-16" />
+      <p
+        v-else-if="!history.length"
+        class="m-0 rounded-lg bg-slate-50 px-3 py-4 text-center text-xs text-slate-500"
+      >
+        درخواست تبدیلی ثبت نشده است.
+      </p>
+
+      <ul v-else class="m-0 flex list-none flex-col gap-2 p-0">
+        <li
+          v-for="item in history"
+          :key="item.id"
+          class="rounded-lg border p-2.5"
+          :class="editingId === item.id ? 'border-amber-400' : 'border-gray-200'"
+        >
+          <div class="flex flex-wrap items-center justify-between gap-2">
+            <span class="text-xs text-slate-500">{{ item.created_at ? toJalali(item.created_at) : '—' }}</span>
+            <span class="inline-flex items-center gap-1 text-xs text-slate-600">
+              <button
+                v-if="item.status === 'pending'"
+                type="button"
+                class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-gray-200 bg-white"
+                aria-label="ویرایش درخواست"
+                title="ویرایش"
+                @click="beginEdit(item)"
+              >
+                <BasicIcon icon="vuesax-linear:edit" size="15" />
+              </button>
+              وضعیت
+              <a-tag class="!m-0" :color="statusColor(item.status)">{{ statusLabel(item.status) }}</a-tag>
+            </span>
+          </div>
+
+          <div class="mt-2 grid grid-cols-2 gap-x-3 gap-y-1 text-xs text-slate-600">
+            <span>دارایی: <b class="text-slate-900">{{ sourceLabel(item.source) }}</b></span>
+            <span>
+              مقدار:
+              <b class="text-slate-900">
+                <bdi>{{ item.asset_unit }}</bdi>
+                <bdi> {{ formatAmount(item.consumed_amount) }}</bdi>
+              </b>
+            </span>
+            <span>حلقه ۱.۵: <b class="text-slate-900">{{ item.wire15_rings }}</b></span>
+            <span>حلقه ۲.۵: <b class="text-slate-900">{{ item.wire25_rings }}</b></span>
+            <span v-if="Number(item.leftover_amount) > 0" class="col-span-2">
+              مانده در دارایی:
+              <b class="text-slate-900">
+                <bdi>{{ item.asset_unit }}</bdi>
+                <bdi> {{ formatAmount(item.leftover_amount) }}</bdi>
+              </b>
+            </span>
+          </div>
+
+          <div v-if="item.status === 'pending'" class="mt-2 flex">
+            <a-button
+              size="small"
+              danger
+              :loading="deletingId === item.id"
+              @click="deleteRequest(item.id)"
+            >
+              حذف
+            </a-button>
+          </div>
+        </li>
+      </ul>
+    </a-spin>
+    </div>
+  </section>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
+import { toJalali } from '@/utils/useDateTime'
+import { useCopperConvertPageContext } from '../composables/useCopperConvertPage'
+
+const props = withDefaults(defineProps<{ variant?: 'stack' | 'side' }>(), {
+  variant: 'stack',
+})
+
+const side = computed(() => props.variant === 'side')
+
+const { history, historyLoading, editingId, beginEdit, deleteRequest, deletingId } =
+  useCopperConvertPageContext()
+
+function sourceLabel(source: string) {
+  if (source === 'katod') return 'کاتد'
+  if (source === 'maftoul') return 'مفتول'
+  if (source === 'shamsh') return 'شمش'
+  return source
+}
+
+function statusLabel(status: string) {
+  if (status === 'pending') return 'در انتظار تایید'
+  if (status === 'approved') return 'تایید شد'
+  if (status === 'rejected') return 'رد شد'
+  return status
+}
+
+function statusColor(status: string) {
+  if (status === 'approved') return 'green'
+  if (status === 'rejected') return 'red'
+  return 'orange'
+}
+
+function formatAmount(value: number) {
+  const amount = Number(value)
+  if (!Number.isFinite(amount)) return '—'
+  return amount.toLocaleString('en-US', { maximumFractionDigits: 3 })
+}
+</script>
diff --git a/src/views/base/convert/composables/useCopperConvertPage.ts b/src/views/base/convert/composables/useCopperConvertPage.ts
index 146f82b..eb4f085 100644
--- a/src/views/base/convert/composables/useCopperConvertPage.ts
+++ b/src/views/base/convert/composables/useCopperConvertPage.ts
@@ -1,6 +1,7 @@
 import {
   computed,
   inject,
+  nextTick,
   onMounted,
   onUnmounted,
   provide,
@@ -10,9 +11,15 @@ import {
   type InjectionKey,
   type Ref,
 } from 'vue'
-import { createCopperConvertRequest } from '@/api/copperConvert'
+import {
+  createCopperConvertRequest,
+  deleteCopperConvertRequest,
+  getCopperConvertRequests,
+  updateCopperConvertRequest,
+  type CopperConvertHistoryRow,
+} from '@/api/copperConvert'
 import { getProducts } from '@/api/products'
-import { message } from 'ant-design-vue'
+import { message, Modal } from 'ant-design-vue'
 import { useWalletAssets } from '@/composables/useWalletAssets'
 import type { Product } from '@/models/products'
 import type { WalletInventoryCard } from '@/models/walletAssets'
@@ -47,6 +54,13 @@ export interface CopperConvertPageContext {
   leftoverAmount: ComputedRef<number>
   submitting: Ref<boolean>
   submitRequest: () => Promise<void>
+  editingId: Ref<number | null>
+  beginEdit: (row: CopperConvertHistoryRow) => Promise<void>
+  cancelEdit: () => void
+  deleteRequest: (id: number) => void
+  deletingId: Ref<number>
+  history: Ref<CopperConvertHistoryRow[]>
+  historyLoading: Ref<boolean>
   prices: ComputedRef<CopperConvertPrices>
   result: ComputedRef<CopperConvertResult | null>
   priceRows: ComputedRef<{ label: string; value: string; missing?: boolean }[]>
@@ -142,6 +156,10 @@ export function useCopperConvertPage() {
   const wire25Rings = ref(0)
   const submitting = ref(false)
   const catalog = ref<Product[]>([])
+  const history = ref<CopperConvertHistoryRow[]>([])
+  const historyLoading = ref(true)
+  const editingId = ref<number | null>(null)
+  const deletingId = ref(0)
   const { assetsSummary, loadWalletAssets } = useWalletAssets()
 
   const assetCards = computed(() => {
@@ -310,24 +328,97 @@ export function useCopperConvertPage() {
     writeRings(rings15For(next25), next25)
   }, { flush: 'sync' })
 
+  function hasPendingRequest() {
+    return history.value.some((row) => row.status === 'pending')
+  }
+
+  async function beginEdit(row: CopperConvertHistoryRow) {
+    if (row.status !== 'pending' || submitting.value) return
+    editingId.value = row.id
+    if (row.source === 'katod' || row.source === 'maftoul' || row.source === 'shamsh') {
+      source.value = row.source
+    }
+    await nextTick()
+    const rings15 = Math.max(0, Math.min(maxRings15.value, Math.floor(Number(row.wire15_rings) || 0)))
+    const rings25 = Math.min(Math.floor(Number(row.wire25_rings) || 0), rings25For(rings15))
+    writeRings(rings15, Math.max(0, rings25))
+    const forms = document.querySelectorAll('[data-convert-form]')
+    const visible = [...forms].find((node) => node instanceof HTMLElement && node.getClientRects().length > 0)
+    visible?.scrollIntoView({ behavior: 'smooth', block: 'start' })
+  }
+
+  function cancelEdit() {
+    if (submitting.value) return
+    editingId.value = null
+    applyDefaultSplit()
+  }
+
+  function deleteRequest(id: number) {
+    if (deletingId.value || submitting.value) return
+    const row = history.value.find((item) => item.id === id)
+    if (!row || row.status !== 'pending') return
+    Modal.confirm({
+      title: 'حذف درخواست',
+      content: 'این درخواست در انتظار تایید حذف شود؟',
+      okText: 'حذف',
+      cancelText: 'انصراف',
+      okType: 'danger',
+      async onOk() {
+        deletingId.value = id
+        try {
+          await deleteCopperConvertRequest(id)
+          if (editingId.value === id) editingId.value = null
+          message.success('درخواست تبدیل حذف شد')
+          await loadHistory()
+        } finally {
+          deletingId.value = 0
+        }
+      },
+    })
+  }
+
   async function submitRequest() {
     if (submitting.value) return
     if (wire15Rings.value + wire25Rings.value < 1) return
+    if (!editingId.value && hasPendingRequest()) {
+      message.warning('یک درخواست در انتظار تایید دارید. همان را ویرایش یا حذف کنید.')
+      return
+    }
     submitting.value = true
     try {
-      await createCopperConvertRequest({
+      const payload = {
         source: source.value,
         rings15: wire15Rings.value,
         rings25: wire25Rings.value,
-      })
+      }
+      if (editingId.value) {
+        await updateCopperConvertRequest(editingId.value, payload)
+        editingId.value = null
+        message.success('درخواست تبدیل به‌روز شد')
+      } else {
+        await createCopperConvertRequest(payload)
+        message.success('درخواست تبدیل برای تأیید ادمین ثبت شد')
+      }
       wire15Rings.value = 0
       wire25Rings.value = 0
-      message.success('درخواست تبدیل برای تأیید ادمین ثبت شد')
+      void loadHistory()
     } finally {
       submitting.value = false
     }
   }
 
+  async function loadHistory() {
+    historyLoading.value = true
+    try {
+      const rows = await getCopperConvertRequests()
+      history.value = Array.isArray(rows) ? rows : []
+    } catch {
+      // خطای شبکه را اینترسپتور نشان می‌دهد؛ لیست قبلی می‌ماند
+    } finally {
+      historyLoading.value = false
+    }
+  }
+
   const priceRows = computed(() => {
     const p = prices.value
     const row = (label: string, amount: number) => ({
@@ -352,6 +443,7 @@ export function useCopperConvertPage() {
         getLastPrices(),
         getProducts(),
         loadWalletAssets(),
+        loadHistory(),
       ])
       catalog.value = Array.isArray(list) ? list : []
     } catch {
@@ -385,6 +477,13 @@ export function useCopperConvertPage() {
     leftoverAmount,
     submitting,
     submitRequest,
+    editingId,
+    beginEdit,
+    cancelEdit,
+    deleteRequest,
+    deletingId,
+    history,
+    historyLoading,
     prices,
     result,
     priceRows,
diff --git a/src/views/base/convert/desktop/DesktopConvertView.vue b/src/views/base/convert/desktop/DesktopConvertView.vue
index fce20ff..90a60a2 100644
--- a/src/views/base/convert/desktop/DesktopConvertView.vue
+++ b/src/views/base/convert/desktop/DesktopConvertView.vue
@@ -1,77 +1,43 @@
 <template>
-  <div class="dconvert">
-    <div class="dconvert__container">
-      <header class="dconvert-topbar">
-        <button type="button" class="dconvert-topbar__back" @click="router.back()">
-          <BasicIcon icon="vuesax-linear:arrow-right-1" size="18" />
-          <span>بازگشت</span>
-        </button>
-        <div class="dconvert-topbar__meta">
-          <p class="dconvert-topbar__eyebrow">محصول</p>
-          <h1 class="dconvert-topbar__title">تبدیل محصول</h1>
-        </div>
-      </header>
+  <div class="dwallet" dir="rtl">
+    <div class="dwallet__container">
+      <DesktopPageTopbar
+        eyebrow="محصول"
+        title="تبدیل محصول"
+        subtitle="تبدیل کاتد، مفتول یا شمش به حلقه سیم"
+        show-back
+      />
 
-      <section class="dconvert-surface">
-        <CopperConvertCalculator />
-      </section>
+      <div class="dwallet-grid dconvert-grid">
+        <section class="dwallet-surface dwallet-form">
+          <CopperConvertCalculator />
+        </section>
+
+        <section class="dwallet-surface dwallet-side dconvert-side">
+          <CopperConvertHistory variant="side" />
+        </section>
+      </div>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
-import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
-import router from '@/router'
+import DesktopPageTopbar from '@/layouts/components/DesktopPageTopbar.vue'
 import CopperConvertCalculator from '../components/CopperConvertCalculator.vue'
+import CopperConvertHistory from '../components/CopperConvertHistory.vue'
 </script>
 
 <style scoped lang="less">
-.dconvert {
+.dconvert-grid {
+  align-items: stretch;
+}
+
+.dconvert-side {
   min-height: 100%;
-  padding: 1.25rem 1.5rem 2rem;
-}
 
-.dconvert__container {
-  max-width: 720px;
-  margin: 0 auto;
-}
-
-.dconvert-topbar {
-  display: flex;
-  align-items: center;
-  gap: 0.75rem;
-  margin-bottom: 1rem;
-}
-
-.dconvert-topbar__back {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.25rem;
-  border: none;
-  background: transparent;
-  color: var(--colorPrimary, #2563eb);
-  font-family: inherit;
-  font-weight: 700;
-  cursor: pointer;
-}
-
-.dconvert-topbar__eyebrow {
-  margin: 0;
-  font-size: 0.75rem;
-  color: #64748b;
-}
-
-.dconvert-topbar__title {
-  margin: 0;
-  font-size: 1.25rem;
-  font-weight: 800;
-  color: #0f172a;
-}
-
-.dconvert-surface {
-  border: 1px solid #e5e7eb;
-  border-radius: 0.875rem;
-  background: #fff;
-  padding: 1.25rem;
+  :deep(.dwallet-side__scroll) {
+    max-height: none;
+    flex: 1;
+  }
 }
 </style>
diff --git a/src/views/base/convert/mobile/MobileConvertView.vue b/src/views/base/convert/mobile/MobileConvertView.vue
index bc9236d..02ced17 100644
--- a/src/views/base/convert/mobile/MobileConvertView.vue
+++ b/src/views/base/convert/mobile/MobileConvertView.vue
@@ -1,10 +1,11 @@
 <template>
   <div>
     <MobilePageHeader title="تبدیل محصول" show-back />
-    <div class="px-5 mpage-content pb-2">
+    <div class="px-5 mpage-content pb-[calc(var(--app-bottom-chrome-height)+1rem)]">
       <div class="border-gray-200 border-1 rounded-xl p-4 relative bg-white">
         <CopperConvertCalculator />
       </div>
+      <CopperConvertHistory />
     </div>
   </div>
 </template>
@@ -12,4 +13,5 @@
 <script lang="ts" setup>
 import MobilePageHeader from '@/layouts/components/MobilePageHeader.vue'
 import CopperConvertCalculator from '../components/CopperConvertCalculator.vue'
+import CopperConvertHistory from '../components/CopperConvertHistory.vue'
 </script>
diff --git a/src/views/base/wallet/desktop/styles/desktop-wallet.less b/src/views/base/wallet/desktop/styles/desktop-wallet.less
index 000f8bf..45af2a0 100644
--- a/src/views/base/wallet/desktop/styles/desktop-wallet.less
+++ b/src/views/base/wallet/desktop/styles/desktop-wallet.less
@@ -120,13 +120,11 @@
 
 .dwallet-surface {
   background: #fff;
-  border: 1px solid rgba(15, 23, 42, 0.06);
   border-radius: 16px;
   box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
 }
 
 .dwallet-form {
-  padding: 24px;
 
   &__title {
     font-size: 16px;