feat(docs): add view details guide, fix dashboard workflows, restore styling, and standardize icons

pages/_app.tsx

@@ -1,5 +1,5 @@
 import '../styles/globals.css'
- 
+
 export default function App({ Component, pageProps }) {
   return <Component {...pageProps} />
 }

pages/guide/certificates/_meta.json

@@ -1,5 +1,6 @@
 {
     "request-new": "Requesting a Certificate",
+    "view-details": "View Details",
     "download-install": "Download & Formats",
     "renewal": "Renewal Process",
     "revocation": "Revocation"

pages/guide/certificates/download-install.mdx

@@ -10,12 +10,16 @@ Once your certificate is issued, you can download it in various formats suitable
 | **PFX / PKCS#12** | `.pfx`, `.p12` | IIS (Windows), Microsoft Exchange, Client Certificates (S/MIME). Contains both key and cert. |
 | **JKS (Java)** | `.jks` | Java applications (Tomcat, Spring Boot). |
 
-## How to Download
+## How to Download (Copy & Save)
 
-1. Go to **"My Certificates"** in the dashboard.
-2. Click on the certificate ID or the **"View"** button.
-3. Scroll to the **"Downloads"** section.
-4. Select the format you need and click **Download**.
+The dashboard allows you to copy the raw certificate data directly.
+
+1.  Navigate to **"My Certificates"** and click the **View (Eye Icon)** button on your certificate.
+2.  **Certificate:** Scroll to the "Certificate (CRT)" section and click the **Copy Icon** in the top right. Paste this into a file named `domain.crt` or `domain.pem`.
+3.  **Private Key:** Scroll to the "Private Key (KEY)" section, click **Show**, then click the **Copy Icon**. Paste this into a file named `domain.key`.
+
+> [!TIP]
+> Use a plain text editor (Notepad, VS Code, Nano) to save these files. Do not use Word or Rich Text editors.
 
 > [!WARNING]
 > The **Private Key** is generated securely. If you lose it, you cannot recover it. You must revoke and re-issue the certificate.

pages/guide/certificates/renewal.mdx

@@ -8,14 +8,17 @@ You will receive an email notification:
 - **7 days** before expiration.
 - **1 day** before expiration.
 
-## How to Renew
+## How to Renew (Manual Re-issue)
 
-1. Log in to TrustLab.
-2. Navigate to **"My Certificates"**.
-3. Identify certificates marked with the **"Expiring Soon"** badge.
-4. Click the **"Renew"** button next to the certificate.
-5. Review the details (CN, SANs). You can add or remove SANs at this stage.
-6. Click **Confirm Renewal**.
+To renew a certificate, you simply generate a fresh one with the same domain name.
+
+1.  Go to **Certificates** and click **"Generate New"**.
+2.  **Identity**: Enter the **same Common Name (CN)** as your expiring certificate.
+3.  **Generate**: The system will issue a new certificate with a fresh validity period.
+4.  **Replace**: Download the new `.crt` (and `.key` if you didn't reuse the CSI) and replace the files on your server.
+
+> [!NOTE]
+> The old certificate will remain valid until it expires naturally. You can safely delete it after verifying the new one works.
 
 ## What Happens Next?
 - A **new certificate** is generated with a new validity period.

pages/guide/certificates/request-new.mdx

@@ -1,5 +1,5 @@
 import { Steps, Callout, Cards, Card } from 'nextra/components'
-import { FileBadge, ShieldCheck, Globe, Code } from 'lucide-react'
+import { FileBadge, ShieldCheck, Globe, Code, Save, AlertTriangle } from 'lucide-react'
 
 # Requesting a New Certificate
 
@@ -40,13 +40,14 @@ Toggle **"Manual Control"** if you need to override the default Identity fields
 *   **Country (C)**: ISO Code.
 
 
-### 4. Submit & Download
+### 4. Generate & Save
 Click **Generate**.
-*   **Private Key**: The system will prompt you to download the `.key` file. **This is the only time it is available.**
-*   **Certificate**: The `.pem` / `.crt` file will be available for download immediately.
+*   The **Certificate (.pem)** and **Private Key (.key)** will be generated.
+*   You can copy them immediately or access them later from the **Certificate Details** page.
+
+<Callout type="info" emoji={<Save className="w-5 h-5" />}>
+  **Storage:** Your Private Key is securely stored. You can view it anytime by clicking **"View Details"** on the certificate list.
+</Callout>
 </Steps>
 
-<Callout type="warning" emoji="⚠️">
-  **Security:** Your **Private Key** is shown/downloaded **ONLY ONCE**. Store it securely immediately. If lost, you must revoke and reissue the certificate.
-</Callout>
 

pages/guide/certificates/revocation.mdx

@@ -7,17 +7,16 @@ Revocation invalidates a certificate before its expiration date. This is critica
 - **Service Change**: The domain name effectively no longer belongs to the service.
 - **Mistake**: The certificate was issued with incorrect details.
 
-## How to Revoke
+## How to Remove / Revoke
 
-1. Open the Certificate Detail page.
-2. Click the **"Revoke"** button (Danger Zone).
-3. Select a **Reason Code**:
-   - `unspecified` (0)
-   - `keyCompromise` (1)
-   - `cACompromise` (2)
-   - `superseded` (4)
-   - `cessationOfOperation` (5)
-4. Confirm the action.
+If a certificate is compromised or no longer needed, you can remove it from the system.
+
+1.  Go to the **Certificates** list.
+2.  Identify the certificate to remove.
+3.  Click the **Trash Icon** (Delete) on the right side of the row.
+4.  **Confirm**: Type `DELETE` in the confirmation modal to permanently remove the certificate and its private key from TrustLab.
+
+![Delete Certificate Action](/images/guide/certificates_list_view_1767869137654.png)
 
 ## CRL (Certificate Revocation List)
 Once revoked, the certificate serial number is added to the TrustLab CRL. All clients checking the CRL will immediately reject the certificate.

pages/guide/certificates/view-details.mdx

@@ -0,0 +1,40 @@
+import { Callout } from 'nextra/components'
+import { ShieldAlert } from 'lucide-react'
+
+# Viewing Certificate Details
+
+After generating a certificate, you can view its full metadata, download the files, or retrieve the Private Key at any time.
+
+## Certificate List
+The main **Certificates** page lists all issuing certificates.
+*   **Status Indicators**: Quickly see if a cert is `Valid`, `Expired`, or `Revoked`.
+*   **Search**: Filter by Common Name or Serial Number.
+
+![Certificate List](/images/guide/certificates_list_view_1767869137654.png)
+
+## Details View
+Clicking the **View Icon** (Eye) or the row opens the detailed management view.
+
+![Certificate Management View](/images/guide/certificate_management_view_1767869044987.png)
+
+### 1. Metadata
+The top section displays critical information:
+*   **Validity Period**: Start and End dates.
+*   **Issuer**: The CA that signed this certificate.
+*   **Subject Info**: Organization, Location, and Country.
+*   **Key Strength**: 2048-bit or 4096-bit.
+
+### 2. Certificate (CRT)
+This text box contains the public certificate in **PEM format** (`-----BEGIN CERTIFICATE-----`).
+*   **Copy**: Click the **Copy Icon** to copy the full block.
+*   This is safe to share publicly.
+
+### 3. Private Key (KEY)
+This section contains your secret Private Key.
+*   **Hidden by Default**: The specific key content is blurred/hidden for security.
+*   **Show**: Click the **"Show"** button to reveal the key.
+*   **Copy**: Click the **Copy Icon** to retrieve it.
+
+<Callout type="error" emoji={<ShieldAlert className="w-5 h-5" />}>
+  **Security Warning:** Never share your Private Key. Anyone with this key can impersonate your server.
+</Callout>

pages/guide/getting-started/access-dashboard.mdx

@@ -1,5 +1,5 @@
 import { Callout, Steps, Cards, Card } from 'nextra/components'
-import { Monitor, Smartphone, LayoutDashboard, Key, Shield } from 'lucide-react'
+import { Monitor, Smartphone, LayoutDashboard, Key, Shield, Info, Clock, AlertTriangle } from 'lucide-react'
 
 # Accessing Dashboard
 
@@ -19,7 +19,7 @@ We prioritize security by offering modern, passwordless authentication options.
 ### 1. Single Sign-On (SSO)
 The fastest way to log in. Click **Continue with Google** or **Continue with GitHub**.
 
-<Callout type="info" emoji="ℹ️">
+<Callout type="info" emoji={<Info className="w-5 h-5" />}>
 **SSO Behavior:**
 *   **Existing Users:** You can only Log In via SSO if your social email address is already registered/linked to your account.
 *   **New Users:** You can **Register** a new account instantly by clicking the Social Login buttons on the *Sign In* or *Register* page.
@@ -39,7 +39,7 @@ You will receive an email with a unique, time-sensitive login link.
 Click the **"Sign in to TrustLab"** button in the email. You will be instantly logged in to the dashboard.
 </Steps>
 
-<Callout type="warning" emoji="⏳">
+<Callout type="warning" emoji={<Clock className="w-5 h-5" />}>
   **Expiration:** Magic links are valid for **15 minutes** only. If it expires, simply request a new one by entering your email again.
 </Callout>
 

pages/guide/getting-started/install-root-ca.mdx

@@ -1,5 +1,5 @@
 import { Tabs, Steps, Cards, Card, Callout } from 'nextra/components'
-import { Monitor, Smartphone } from 'lucide-react'
+import { Monitor, Smartphone, AlertTriangle, Info } from 'lucide-react'
 
 # Installing Root CA
 
@@ -43,11 +43,11 @@ Select your distribution to get the optimized installation command:
   <Card icon={<Smartphone className="w-6 h-6" />} title="macOS / iOS Profile (.mobileconfig)" href="https://cdn.trustlab.dyzulk.com/ca/bundles/trustlab-all.mobileconfig" arrow />
 </Cards>
 
-<Callout type="warning" emoji="⚠️">
+<Callout type="warning" emoji={<AlertTriangle className="w-5 h-5" />}>
   **Windows Users:** You **MUST** right-click the `.bat` file and select **"Run as Administrator"**. Double-clicking directly will likely fail due to permission restrictions.
 </Callout>
 
-<Callout type="info" emoji="ℹ️">
+<Callout type="info" emoji={<Info className="w-5 h-5" />}>
   **Apple Users:** After downloading the profile, go to **System Settings > Privacy & Security > Profiles** to install it. For iOS, see the *Individual Installation* section below for detailed trust steps.
 </Callout>