chore(docs): reposition the smart account documentation

Author: awisniew207

docs/ability/official-abilities/overview.mdx

@@ -9,7 +9,7 @@ title: Official Abilities
 | Ability                                             | Category      | Description                                                                                                                                 |
 | --------------------------------------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
 | [Aave](./aave)                                      | DeFi Protocol | Integrate with the Aave V3 lending protocol to supply, borrow, repay, and withdraw assets, unlocking a full suite of DeFi lending features. |
-| [Aave Smart Account](./aave-smart-account)          | DeFi Protocol | Validate and sign ERC-4337 UserOperations for Aave protocol interactions with Smart Accounts, enabling secure delegated signing with comprehensive validation. |
+| [Aave Smart Account](/smart-account/abilities/aave-smart-account)          | DeFi Protocol | Validate and sign ERC-4337 UserOperations for Aave protocol interactions with Smart Accounts, enabling secure delegated signing with comprehensive validation. |
 | [Aerodrome Swap](./aerodrome-swap)                  | DeFi Protocol | Execute token swaps on Aerodrome DEX on Base network with integrated approval management and optional gas sponsorship.                      |
 | [deBridge](./debridge)                              | Cross-Chain   | Bridge tokens across multiple blockchains using the deBridge protocol, streamlining cross-chain transfers.                                  |
 | [ERC20 Approval](./erc20-approval)                  | Utility       | Manage ERC20 token allowances, a foundational step for enabling DeFi operations like swaps, lending, and liquidity provision.               |

docs/concepts/wallets/about.mdx

@@ -28,7 +28,7 @@ Vincent Wallets are non-custodial, cross-chain wallets powered by [Lit Protocol'
   <Card title="Agent Wallets" icon="wallet" href="/concepts/wallets/agent-wallets" color="#FF4205">
     Understand app-specific wallet delegation
   </Card>
-  <Card title="Smart Accounts" icon="microchip" href="/concepts/wallets/smart-accounts" color="#FF4205">
+  <Card title="Smart Accounts" icon="microchip" href="/smart-account/introduction/about" color="#FF4205">
     Discover programmable accounts with delegated signing
   </Card>
 </Columns>

docs/docs.json

@@ -26,8 +26,7 @@
                 "pages": [
                   "concepts/wallets/about",
                   "concepts/wallets/user-accounts",
-                  "concepts/wallets/agent-wallets",
-                  "concepts/wallets/smart-accounts"
+                  "concepts/wallets/agent-wallets"
                 ]
               }
             ]
@@ -77,7 +76,6 @@
                 "pages": [
                   "ability/official-abilities/overview",
                   "ability/official-abilities/aave",
-                  "ability/official-abilities/aave-smart-account",
                   "ability/official-abilities/aerodrome-swap",
                   "ability/official-abilities/debridge",
                   "ability/official-abilities/erc20-approval",
@@ -120,6 +118,19 @@
           }
         ]
       },
+      {
+        "tab": "Smart Account Developers",
+        "groups": [
+          {
+            "group": "Introduction",
+            "pages": ["smart-account/introduction/about"]
+          },
+          {
+            "group": "Abilities",
+            "pages": ["smart-account/abilities/aave-smart-account"]
+          }
+        ]
+      },
       {
         "tab": "API Reference",
         "groups": [

docs/ability/official-abilities/aave-smart-account.mdx renamed to docs/smart-account/abilities/aave-smart-account.mdx

@@ -46,7 +46,7 @@ Depending on your role in the Vincent Ecosystem, you'll be interacting with this
 - **Vincent App Delegatees**: If you're executing this ability on behalf of Vincent App Users, go [here](#executing-the-ability-as-a-vincent-app-delegatee).
 
 <Note>
-This ability is designed for Smart Account (ERC-4337) workflows. If you're using regular EOA wallets, use the standard [Aave Ability](./aave) instead.
+This ability is designed for Smart Account (ERC-4337) workflows. If you're using regular EOA wallets, use the standard [Aave Ability](/ability/official-abilities/aave) instead.
 </Note>
 
 ## Adding the Ability to your Vincent App
@@ -99,7 +99,7 @@ graph TD
 
 </div>
 
-Learn more about Smart Accounts in the [Smart Accounts concept guide](/concepts/wallets/smart-accounts).
+Learn more about Smart Accounts in the [Smart Accounts concept guide](/smart-account/introduction/about).
 
 ### Executing the `precheck` Function
 
@@ -524,7 +524,7 @@ Network support is limited by Alchemy's `alchemy_simulateUserOperationAssetChang
 ## Learn More
 
 <Columns cols={3}>
-  <Card title="Smart Accounts" icon="microchip" href="/concepts/wallets/smart-accounts" color="#FF4205">
+  <Card title="Smart Accounts" icon="microchip" href="/smart-account/introduction/about" color="#FF4205">
     Learn about Smart Account architecture with Vincent
   </Card>
   <Card title="Standard Aave Ability" icon="coins" href="/ability/official-abilities/aave" color="#FF4205">

docs/concepts/wallets/smart-accounts.mdx renamed to docs/smart-account/introduction/about.mdx

@@ -1,5 +1,5 @@
 ---
-title: 'Smart Accounts'
+title: 'About'
 ---
 
 Smart Accounts are programmable blockchain accounts that enable advanced transaction patterns beyond traditional wallet capabilities. When integrated with Vincent, Smart Accounts allow you to delegate signing authority to Agent Wallets with built-in safety validation, unlocking powerful automation while maintaining full control over your assets.

docs/style.css

@@ -22,3 +22,27 @@
 .edgeLabel text {
   fill: white !important;
 }
+
+/* Fix code blocks in light mode */
+.light pre,
+.light pre[class*="language-"] {
+  background-color: #f6f8fa !important;
+}
+
+.light code,
+.light code[class*="language-"] {
+  background-color: #f6f8fa !important;
+  color: #24292f !important;
+}
+
+.light pre code {
+  background-color: transparent !important;
+}
+
+/* Ensure inline code has proper styling */
+.light :not(pre) > code {
+  background-color: rgba(175, 184, 193, 0.2) !important;
+  color: #24292f !important;
+  padding: 0.2em 0.4em !important;
+  border-radius: 6px !important;
+}