<>
@@ -53,15 +68,7 @@ export default function PageWallets() {
- {wallets && wallets.length === 0 && (
-
- No wallets,{" "}
- create one
-
- ?
-
- )}
+ {wallets && wallets.length === 0 &&
}
{wallets &&
wallets
.filter((wallet) => showArchived || !wallet.isArchived)
@@ -72,14 +79,30 @@ export default function PageWallets() {
? 1
: -1,
)
- .map((wallet) => (
-
- ))}
+ .map((wallet) => {
+ const walletBalance = balances[wallet.id] ?? null;
+ const walletLoadingState = loadingStates[wallet.id] ?? "idle";
+ // Debug log
+ if (process.env.NODE_ENV === "development") {
+ console.log(`Wallet ${wallet.id}: balance=${walletBalance}, loadingState=${walletLoadingState}`);
+ }
+ return (
+
+ );
+ })}
{newPendingWallets && newPendingWallets.length > 0 && (
<>
{newPendingWallets
.sort((a, b) => a.name.localeCompare(b.name))
@@ -99,6 +122,9 @@ export default function PageWallets() {
New Wallets awaiting creation
+
{getUserNewWalletsNotOwner
.sort((a, b) => a.name.localeCompare(b.name))
@@ -113,11 +139,38 @@ export default function PageWallets() {
);
}
-function CardWallet({ wallet }: { wallet: Wallet }) {
+function CardWallet({
+ wallet,
+ balance,
+ loadingState,
+}: {
+ wallet: Wallet;
+ balance: number | null;
+ loadingState: "idle" | "loading" | "loaded" | "error";
+}) {
+ const network = useSiteStore((state) => state.network);
const { transactions: pendingTransactions } = usePendingTransactions({
walletId: wallet.id,
});
+ // Rebuild the multisig wallet to get the correct canonical address for display
+ // This ensures we show the correct address even if wallet.address was built incorrectly
+ const displayAddress = useMemo(() => {
+ try {
+ const walletNetwork = wallet.signersAddresses.length > 0
+ ? addressToNetwork(wallet.signersAddresses[0]!)
+ : network;
+ const mWallet = buildMultisigWallet(wallet, walletNetwork);
+ if (mWallet) {
+ return mWallet.getScript().address;
+ }
+ } catch (error) {
+ console.error(`Error building wallet for display: ${wallet.id}`, error);
+ }
+ // Fallback to wallet.address if rebuild fails (legacy support)
+ return wallet.address;
+ }, [wallet, network]);
+
return (
+ {
if (!globeRef.current) return;
@@ -106,10 +106,18 @@ export function Globe({ globeConfig, data }: WorldProps) {
emissiveIntensity: number;
shininess: number;
};
- globeMaterial.color = new Color(globeConfig.globeColor);
- globeMaterial.emissive = new Color(globeConfig.emissive);
- globeMaterial.emissiveIntensity = globeConfig.emissiveIntensity || 0.1;
- globeMaterial.shininess = globeConfig.shininess || 0.9;
+ globeMaterial.color = new Color(globeConfig.globeColor || defaultProps.globeColor);
+ globeMaterial.emissive = new Color(globeConfig.emissive || defaultProps.emissive);
+ globeMaterial.emissiveIntensity = globeConfig.emissiveIntensity ?? defaultProps.emissiveIntensity;
+ globeMaterial.shininess = globeConfig.shininess ?? defaultProps.shininess;
+
+ // Update atmosphere if globe ref is available
+ if (globeRef.current) {
+ globeRef.current
+ .showAtmosphere(globeConfig.showAtmosphere ?? defaultProps.showAtmosphere)
+ .atmosphereColor(globeConfig.atmosphereColor || defaultProps.atmosphereColor)
+ .atmosphereAltitude(globeConfig.atmosphereAltitude ?? defaultProps.atmosphereAltitude);
+ }
};
const _buildData = () => {
@@ -179,7 +187,8 @@ export function Globe({ globeConfig, data }: WorldProps) {
return (e as { arcAlt: number }).arcAlt * 1;
})
.arcStroke(() => {
- return [0.32, 0.28, 0.3][Math.round(Math.random() * 2)] || null;
+ // Enhanced stroke widths for better visibility
+ return [0.4, 0.35, 0.38][Math.round(Math.random() * 2)] || 0.35;
})
.arcDashLength(defaultProps.arcLength)
.arcDashInitialGap((e) => (e as { order: number }).order * 1)
@@ -191,7 +200,7 @@ export function Globe({ globeConfig, data }: WorldProps) {
.pointColor((e) => (e as { color: string }).color)
.pointsMerge(true)
.pointAltitude(0.0)
- .pointRadius(2);
+ .pointRadius(globeConfig.pointSize || defaultProps.pointSize);
globeRef.current
.ringsData([])
@@ -246,23 +255,33 @@ export function WebGLRendererConfig() {
export function World(props: WorldProps) {
const { globeConfig } = props;
const scene = new Scene();
- scene.fog = new Fog(0xffffff, 400, 2000);
+ // Enhanced fog for better depth perception
+ scene.fog = new Fog(0x000000, 400, 2000);
return (
-
+
);
diff --git a/src/env.js b/src/env.js
index c3a380bc..13a22974 100644
--- a/src/env.js
+++ b/src/env.js
@@ -13,6 +13,7 @@ export const env = createEnv({
.default("development"),
BLOB_READ_WRITE_TOKEN: z.string(),
GITHUB_TOKEN: z.string(),
+ JWT_SECRET: z.string().min(32),
// NEXTAUTH_SECRET:
// process.env.NODE_ENV === "production"
// ? z.string()
@@ -55,6 +56,7 @@ export const env = createEnv({
process.env.NEXT_PUBLIC_BLOCKFROST_API_KEY_PREPROD,
BLOB_READ_WRITE_TOKEN: process.env.BLOB_READ_WRITE_TOKEN,
GITHUB_TOKEN: process.env.GITHUB_TOKEN,
+ JWT_SECRET: process.env.JWT_SECRET,
},
/**
* Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially
diff --git a/src/hooks/useWalletBalances.ts b/src/hooks/useWalletBalances.ts
new file mode 100644
index 00000000..2f83015e
--- /dev/null
+++ b/src/hooks/useWalletBalances.ts
@@ -0,0 +1,262 @@
+import { useEffect, useRef, useState, useCallback } from "react";
+import { UTxO } from "@meshsdk/core";
+import { Wallet } from "@/types/wallet";
+import { getProvider } from "@/utils/get-provider";
+import { getBalanceFromUtxos } from "@/utils/getBalance";
+import { addressToNetwork } from "@/utils/multisigSDK";
+import { buildMultisigWallet } from "@/utils/common";
+import { useSiteStore } from "@/lib/zustand/site";
+
+type WalletBalanceState = "idle" | "loading" | "loaded" | "error";
+
+interface UseWalletBalancesResult {
+ balances: Record;
+ loadingStates: Record;
+ isFetching: boolean;
+}
+
+interface UseWalletBalancesOptions {
+ cooldownMs?: number;
+}
+
+export default function useWalletBalances(
+ wallets: Wallet[] | undefined,
+ options: UseWalletBalancesOptions = {},
+): UseWalletBalancesResult {
+ const { cooldownMs = 400 } = options;
+ const network = useSiteStore((state) => state.network);
+ const [balances, setBalances] = useState>({});
+ const [loadingStates, setLoadingStates] = useState<
+ Record
+ >({});
+ const [isFetching, setIsFetching] = useState(false);
+
+ const queueRef = useRef([]);
+ const processingRef = useRef(false);
+ const abortControllerRef = useRef(null);
+ const fetchedWalletsRef = useRef>(new Set());
+ const initializedWalletsRef = useRef>(new Set());
+ const lastWalletIdsRef = useRef("");
+
+ const fetchWalletBalance = useCallback(
+ async (wallet: Wallet): Promise => {
+ // Skip if already fetched
+ if (fetchedWalletsRef.current.has(wallet.id)) {
+ return;
+ }
+
+ // Mark as loading
+ setLoadingStates((prev) => ({ ...prev, [wallet.id]: "loading" }));
+
+ try {
+ // Rebuild the multisig wallet to get the correct address
+ // This ensures we use the canonical script address, not the potentially wrong wallet.address
+ // Determine network from signer addresses or use the current network
+ const walletNetwork = wallet.signersAddresses.length > 0
+ ? addressToNetwork(wallet.signersAddresses[0]!)
+ : network;
+
+ const mWallet = buildMultisigWallet(wallet, walletNetwork);
+ if (!mWallet) {
+ throw new Error("Failed to build multisig wallet");
+ }
+
+ // Get the correct address from the multisig wallet script
+ const walletAddress = mWallet.getScript().address;
+
+ // Use the network determined from the address
+ const addressNetwork = addressToNetwork(walletAddress);
+ const provider = getProvider(addressNetwork);
+
+ console.log(`Fetching balance for wallet ${wallet.id} (${walletAddress.slice(0, 20)}...)`);
+
+ // Fetch address info using Blockfrost API
+ // This returns an object with an 'amount' array containing assets
+ const addressInfo = await provider.get(`/addresses/${walletAddress}/`);
+
+ console.log(`Fetched address info for wallet ${wallet.id}`, addressInfo);
+
+ // Calculate balance from assets
+ // Blockfrost returns { amount: [{ unit: string, quantity: string }] }
+ let balance = 0;
+ if (addressInfo && addressInfo.amount && Array.isArray(addressInfo.amount)) {
+ const lovelaceAsset = addressInfo.amount.find(
+ (asset: { unit: string; quantity: string }) => asset.unit === "lovelace"
+ );
+ if (lovelaceAsset) {
+ const lovelaceAmount = parseInt(lovelaceAsset.quantity);
+ balance = lovelaceAmount / 1000000;
+ balance = Math.round(balance * 100) / 100;
+ console.log(`Found lovelace asset: ${lovelaceAmount} lovelace = ${balance} ADA`);
+ } else {
+ console.log(`No lovelace asset found in address info for wallet ${wallet.id}`);
+ }
+ } else {
+ console.warn(`Invalid address info format for wallet ${wallet.id}:`, addressInfo);
+ }
+
+ console.log(`Final balance for wallet ${wallet.id}: ${balance} ADA`);
+
+ // Update state
+ setBalances((prev) => ({ ...prev, [wallet.id]: balance }));
+ setLoadingStates((prev) => ({ ...prev, [wallet.id]: "loaded" }));
+ fetchedWalletsRef.current.add(wallet.id);
+ } catch (error) {
+ console.error(`Error fetching balance for wallet ${wallet.id}:`, error);
+ setBalances((prev) => ({ ...prev, [wallet.id]: null }));
+ setLoadingStates((prev) => ({ ...prev, [wallet.id]: "error" }));
+ fetchedWalletsRef.current.add(wallet.id); // Mark as attempted to avoid retries
+ }
+ },
+ [],
+ );
+
+ const processQueue = useCallback(async () => {
+ if (processingRef.current) {
+ console.log("Queue processing already in progress");
+ return;
+ }
+
+ if (queueRef.current.length === 0) {
+ console.log("Queue is empty, stopping fetch");
+ setIsFetching(false);
+ return;
+ }
+
+ console.log(`Starting to process ${queueRef.current.length} wallets`);
+ processingRef.current = true;
+ setIsFetching(true);
+
+ // Create abort controller for this batch
+ abortControllerRef.current = new AbortController();
+
+ try {
+ while (
+ queueRef.current.length > 0 &&
+ !abortControllerRef.current.signal.aborted
+ ) {
+ const wallet = queueRef.current.shift();
+ if (!wallet) break;
+
+ // Skip if already fetched
+ if (fetchedWalletsRef.current.has(wallet.id)) {
+ console.log(`Skipping wallet ${wallet.id} - already fetched`);
+ continue;
+ }
+
+ console.log(`Processing wallet ${wallet.id} from queue`);
+ await fetchWalletBalance(wallet);
+
+ // Cooldown between requests (except for the last one)
+ if (queueRef.current.length > 0) {
+ await new Promise((resolve) => setTimeout(resolve, cooldownMs));
+ }
+ }
+ console.log("Finished processing queue");
+ } finally {
+ processingRef.current = false;
+ setIsFetching(queueRef.current.length > 0);
+ }
+ }, [fetchWalletBalance, cooldownMs]);
+
+ useEffect(() => {
+ // Wait for wallets to be available
+ if (!wallets) {
+ console.log("Wallets not yet loaded, waiting...");
+ return;
+ }
+
+ if (wallets.length === 0) {
+ console.log("No wallets provided to useWalletBalances");
+ setIsFetching(false);
+ return;
+ }
+
+ console.log(`useWalletBalances effect: ${wallets.length} wallets provided`);
+
+ // Create a stable reference to wallet IDs for comparison
+ const walletIds = wallets.map((w) => w.id).sort().join(",");
+
+ // Check if this is the first time wallets are loaded (lastWalletIdsRef is empty)
+ const isFirstLoad = lastWalletIdsRef.current === "";
+
+ // On first load (refresh), clear the fetched wallets set so we refetch balances
+ if (isFirstLoad) {
+ console.log("First load detected, clearing fetched wallets cache");
+ fetchedWalletsRef.current.clear();
+ initializedWalletsRef.current.clear();
+ }
+
+ // Only process if wallet IDs have actually changed OR if this is the first load
+ if (!isFirstLoad && walletIds === lastWalletIdsRef.current) {
+ console.log("Wallet IDs unchanged, checking if queue needs processing");
+ // Wallets haven't changed, but check if we need to continue processing
+ if (!processingRef.current && queueRef.current.length > 0) {
+ console.log("Resuming queue processing");
+ processQueue().catch((error) => {
+ console.error("Error processing balance queue:", error);
+ processingRef.current = false;
+ setIsFetching(false);
+ });
+ }
+ return;
+ }
+
+ console.log(isFirstLoad ? "First load, processing wallets" : "Wallet IDs changed, processing new wallets");
+ lastWalletIdsRef.current = walletIds;
+
+ // Filter out wallets that have already been fetched
+ const walletsToFetch = wallets.filter(
+ (wallet) => !fetchedWalletsRef.current.has(wallet.id),
+ );
+
+ console.log(`${walletsToFetch.length} wallets need balance fetching`);
+
+ if (walletsToFetch.length === 0) {
+ setIsFetching(false);
+ return;
+ }
+
+ // Initialize loading states for new wallets
+ walletsToFetch.forEach((wallet) => {
+ if (!initializedWalletsRef.current.has(wallet.id)) {
+ setLoadingStates((prev) => ({ ...prev, [wallet.id]: "idle" }));
+ initializedWalletsRef.current.add(wallet.id);
+ }
+ });
+
+ // Clear queue and add new wallets (on refresh, we want to refetch)
+ queueRef.current = [];
+ walletsToFetch.forEach((wallet) => {
+ queueRef.current.push(wallet);
+ });
+
+ console.log(`Added ${walletsToFetch.length} wallets to queue. Queue length: ${queueRef.current.length}`);
+
+ // Start processing if not already processing
+ if (!processingRef.current) {
+ console.log("Starting queue processing");
+ processQueue().catch((error) => {
+ console.error("Error processing balance queue:", error);
+ processingRef.current = false;
+ setIsFetching(false);
+ });
+ } else {
+ console.log("Queue processing already in progress, skipping");
+ }
+
+ // Cleanup on unmount
+ return () => {
+ if (abortControllerRef.current) {
+ abortControllerRef.current.abort();
+ }
+ };
+ }, [wallets, processQueue]);
+
+ return {
+ balances,
+ loadingStates,
+ isFetching,
+ };
+}
+
diff --git a/src/pages/api-docs.tsx b/src/pages/api-docs.tsx
index 46091408..235283f8 100644
--- a/src/pages/api-docs.tsx
+++ b/src/pages/api-docs.tsx
@@ -1,5 +1,8 @@
// src/pages/api-docs.tsx
import dynamic from "next/dynamic";
+import React, { useEffect, useState, useRef } from "react";
+import { useWallet } from "@meshsdk/react";
+import { Key, Lightbulb, Copy, Check } from "lucide-react";
import Globe from "./globe";
// Avoid SSR for Swagger UI
@@ -7,9 +10,269 @@ const SwaggerUI = dynamic(() => import("swagger-ui-react"), { ssr: false });
import "swagger-ui-react/swagger-ui.css";
export default function ApiDocs() {
+ const { wallet, connected } = useWallet();
+ const [isGeneratingToken, setIsGeneratingToken] = useState(false);
+ const [generatedToken, setGeneratedToken] = useState(null);
+ const [copied, setCopied] = useState(false);
+ const generateTokenRef = React.useRef<(() => Promise) | null>(null);
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ const swaggerSystemRef = useRef(null);
+ const tokenInputRef = useRef(null);
+
+ const generateBearerToken = async () => {
+ if (!wallet || !connected) return;
+
+ setIsGeneratingToken(true);
+ setGeneratedToken(null); // Clear previous token
+ setCopied(false); // Reset copy state
+ try {
+ // Get the wallet address
+ const addresses = await wallet.getUsedAddresses();
+ const address = addresses[0];
+
+ // Step 1: Get nonce
+ const nonceResponse = await fetch(`/api/v1/getNonce?address=${address}`);
+ if (!nonceResponse.ok) {
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+ const errorData = await nonceResponse.json().catch(() => ({}));
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-argument, @typescript-eslint/prefer-nullish-coalescing
+ throw new Error((errorData as { error?: string }).error || "Failed to get nonce");
+ }
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+ const { nonce } = await nonceResponse.json() as { nonce: string };
+
+ // Step 2: Sign the nonce
+ let signature: { signature: string; key: string } | undefined;
+ try {
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-argument
+ signature = await wallet.signData(nonce, address) as { signature: string; key: string };
+ } catch (error) {
+ // User declined to sign or signing was cancelled
+ if (error instanceof Error) {
+ const errorMessage = error.message.toLowerCase();
+ if (errorMessage.includes("user") || errorMessage.includes("cancel") || errorMessage.includes("decline") || errorMessage.includes("reject")) {
+ throw new Error("Signing cancelled. Please try again and approve the signing request.");
+ }
+ }
+ throw new Error("Failed to sign nonce. Please try again.");
+ }
+
+ if (!signature?.signature || !signature?.key) {
+ throw new Error("Invalid signature received from wallet.");
+ }
+
+ // Step 3: Exchange signature for token
+ const tokenResponse = await fetch("/api/v1/authSigner", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ address,
+ signature: signature.signature,
+ key: signature.key,
+ }),
+ });
+
+ if (!tokenResponse.ok) {
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+ const errorData = await tokenResponse.json().catch(() => ({}));
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-argument, @typescript-eslint/prefer-nullish-coalescing
+ throw new Error((errorData as { error?: string }).error || "Failed to generate token");
+ }
+
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+ const { token } = await tokenResponse.json() as { token: string };
+
+ // Store the token for display
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+ setGeneratedToken(token);
+
+ // Step 4: Set authorization using Swagger UI's programmatic API
+ if (swaggerSystemRef.current) {
+ try {
+ // Use Swagger UI's internal API to set authorization
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
+ const authActions = (swaggerSystemRef.current as { getSystem: () => { authActions: { authorize: (config: { BearerAuth: { value: string } }) => void } } }).getSystem().authActions;
+
+ // Set the authorization for BearerAuth scheme
+ // Swagger UI expects the token value directly for bearer tokens
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
+ authActions.authorize({
+ BearerAuth: {
+ value: token,
+ },
+ });
+ } catch (error) {
+ console.warn("Failed to set authorization programmatically, falling back to DOM manipulation:", error);
+ // Fall through to DOM manipulation fallback
+ }
+ }
+
+ // Fallback: Use DOM manipulation if programmatic API fails or isn't available
+ if (!swaggerSystemRef.current) {
+ // Fallback: Try to use DOM manipulation with better event handling
+ const authorizeButton = document.querySelector(".swagger-ui .btn.authorize") as HTMLElement;
+ if (authorizeButton) {
+ authorizeButton.click();
+
+ // Wait for modal to open and fill token with proper React event simulation
+ const fillToken = () => {
+ const tokenInput = document.querySelector(
+ ".swagger-ui .auth-container input[type='text'], .swagger-ui .auth-container input[type='password']"
+ ) as HTMLInputElement;
+ if (tokenInput) {
+ // Set value
+ const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
+ window.HTMLInputElement.prototype,
+ "value"
+ )?.set;
+ if (nativeInputValueSetter) {
+ // eslint-disable-next-line @typescript-eslint/unbound-method
+ nativeInputValueSetter.call(tokenInput, token);
+ } else {
+ tokenInput.value = token;
+ }
+
+ // Trigger React events properly
+ const inputEvent = new Event("input", { bubbles: true, cancelable: true });
+ const changeEvent = new Event("change", { bubbles: true, cancelable: true });
+ tokenInput.dispatchEvent(inputEvent);
+ tokenInput.dispatchEvent(changeEvent);
+
+ // Also trigger React's onChange handler
+ const reactEvent = new Event("input", { bubbles: true });
+ Object.defineProperty(reactEvent, "target", {
+ writable: false,
+ value: tokenInput,
+ });
+ tokenInput.dispatchEvent(reactEvent);
+
+ // Click authorize button in modal after a short delay
+ setTimeout(() => {
+ const authorizeBtn = document.querySelector(
+ ".swagger-ui .auth-container .btn-done, .swagger-ui .auth-container .authorize"
+ ) as HTMLElement | null;
+ if (authorizeBtn) {
+ authorizeBtn.click();
+ }
+ }, 200);
+ return true;
+ }
+ return false;
+ };
+
+ // Try multiple times as modal might take time to render
+ let attempts = 0;
+ const interval = setInterval(() => {
+ attempts++;
+ if (fillToken() || attempts > 15) {
+ clearInterval(interval);
+ }
+ }, 150);
+ }
+ }
+ } catch (error) {
+ console.error("Error generating token:", error);
+ alert(`Failed to generate token: ${error instanceof Error ? error.message : "Unknown error"}`);
+ setGeneratedToken(null);
+ } finally {
+ setIsGeneratingToken(false);
+ }
+ };
+
+ const copyToken = async () => {
+ if (!generatedToken) return;
+
+ try {
+ await navigator.clipboard.writeText(generatedToken);
+ setCopied(true);
+ setTimeout(() => setCopied(false), 2000);
+ } catch {
+ // Fallback for older browsers
+ if (tokenInputRef.current) {
+ tokenInputRef.current.select();
+ tokenInputRef.current.setSelectionRange(0, 99999);
+ document.execCommand("copy");
+ setCopied(true);
+ setTimeout(() => setCopied(false), 2000);
+ }
+ }
+ };
+
+ // Store function reference for DOM access
+ generateTokenRef.current = generateBearerToken;
+
+ useEffect(() => {
+ // Add info text next to authorize button after Swagger UI loads
+ const addAuthInfo = () => {
+ const schemeContainer = document.querySelector(".swagger-ui .scheme-container");
+ if (schemeContainer && !schemeContainer.querySelector(".auth-info-text")) {
+ const infoText = document.createElement("div");
+ infoText.className = "auth-info-text";
+ infoText.innerHTML = `
+ ℹ️
+ Enter your JWT token (format: Bearer <token> or just <token>)
+ `;
+ schemeContainer.appendChild(infoText);
+ return true;
+ }
+ return false;
+ };
+
+ // Update floating button state
+ const updateFloatingButton = () => {
+ const floatingBtn = document.querySelector(".floating-token-generator-btn")!;
+ const floatingText = document.querySelector(".floating-token-generator-text");
+ if (floatingBtn) {
+ (floatingBtn as HTMLButtonElement).disabled = isGeneratingToken;
+ if (floatingText) {
+ floatingText.textContent = isGeneratingToken ? "Generating..." : "Generate Token";
+ }
+ }
+ };
+
+ // Try immediately
+ addAuthInfo();
+ updateFloatingButton();
+
+ // Use MutationObserver to detect when Swagger UI loads
+ const observer = new MutationObserver(() => {
+ addAuthInfo();
+ updateFloatingButton();
+ });
+
+ // Observe the Swagger UI container
+ const swaggerContainer = document.querySelector(".swagger-ui");
+ if (swaggerContainer) {
+ observer.observe(swaggerContainer, {
+ childList: true,
+ subtree: true,
+ });
+ }
+
+ // Also try after delays as fallback
+ const timer = setTimeout(() => {
+ addAuthInfo();
+ updateFloatingButton();
+ }, 500);
+ const timer2 = setTimeout(() => {
+ addAuthInfo();
+ updateFloatingButton();
+ observer.disconnect();
+ }, 2000);
+
+ return () => {
+ observer.disconnect();
+ clearTimeout(timer);
+ clearTimeout(timer2);
+ };
+ }, [connected, wallet, isGeneratingToken]);
+
return (
-
+
{
+ // Store the Swagger UI system instance for programmatic access
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+ swaggerSystemRef.current = system;
+ }}
/>
+
+ {/* Floating token generator button */}
+
+
+ {connected ? (
+ <>
+
+
+ {isGeneratingToken ? "Generating..." : "Generate Token"}
+
+
+ {generatedToken && (
+
+
Generated Token:
+
+
+ {copied ?
+
+
+ )}
+
+ ) : (
+
+ Connect wallet to generate token
+
+ )}
+
+
{/* @ts-ignore */}
- {live &&
diff --git a/src/styles/swagger-overrides.css b/src/styles/swagger-overrides.css
index 4662f33d..2cd54f2d 100644
--- a/src/styles/swagger-overrides.css
+++ b/src/styles/swagger-overrides.css
@@ -1,38 +1,4058 @@
-
+/* Base styles - Light mode defaults */
.swagger-ui .scheme-container,
.swagger-ui .opblock-tag,
.swagger-ui .opblock-summary-description,
.swagger-ui .opblock-summary-path,
.swagger-ui .response-col_status {
- color: #ffffff !important;
+ color: #3b4151 !important;
}
+/* Form inputs and fields - Light mode */
.swagger-ui input,
-.swagger-ui .auth-wrapper input {
+.swagger-ui .auth-wrapper input,
+.swagger-ui textarea,
+.swagger-ui select {
color: #000 !important;
background-color: #fff !important;
+ border: 1px solid rgba(0, 0, 0, 0.2) !important;
+}
+
+.swagger-ui input:focus,
+.swagger-ui textarea:focus,
+.swagger-ui select:focus {
+ border-color: rgba(0, 0, 0, 0.4) !important;
+ outline: none !important;
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui input::placeholder,
+.swagger-ui textarea::placeholder {
+ color: rgba(0, 0, 0, 0.5) !important;
}
.swagger-ui .auth-wrapper {
- background-color: rgba(255, 255, 255, 0.1);
+ background-color: rgba(0, 0, 0, 0.05);
+}
+
+/* Authorization modal/popup - Light mode */
+.swagger-ui .modal-ux,
+.swagger-ui .modal-ux-backdrop {
+ background-color: rgba(0, 0, 0, 0.5) !important;
+}
+
+.swagger-ui .modal-ux-content {
+ background-color: #ffffff !important;
+ color: #3b4151 !important;
+ border-radius: 8px !important;
+ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
+ display: flex !important;
+ flex-direction: column !important;
+ max-height: 90vh !important;
+ max-width: 600px !important;
+ width: calc(100% - 32px) !important;
+ margin: 0 auto !important;
+ overflow-y: auto !important;
+ overflow-x: hidden !important;
+}
+
+.swagger-ui .modal-ux-header {
+ background-color: #ffffff !important;
+ color: #3b4151 !important;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
+ padding: 16px 20px !important;
+ margin: 0 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: space-between !important;
+ border-radius: 8px 8px 0 0 !important;
+}
+
+.swagger-ui .modal-ux-header h3,
+.swagger-ui .modal-ux-header h4,
+.swagger-ui .modal-ux-header div {
+ color: #3b4151 !important;
+ font-weight: 600 !important;
+ font-size: 18px !important;
+ margin: 0 !important;
+ padding: 0 !important;
+}
+
+.swagger-ui .modal-ux-header .close-modal {
+ background-color: transparent !important;
+ border: none !important;
+ color: #3b4151 !important;
+ cursor: pointer !important;
+ padding: 4px 8px !important;
+ border-radius: 4px !important;
+ transition: background-color 0.2s ease !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ width: 32px !important;
+ height: 32px !important;
+}
+
+.swagger-ui .modal-ux-header .close-modal:hover {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container {
+ color: #3b4151 !important;
+ padding: 24px !important;
+ background-color: #ffffff !important;
+ border-radius: 0 0 8px 8px !important;
+ line-height: 1.6 !important;
+}
+
+.swagger-ui .modal-ux-content > div:not(.modal-ux-header) {
+ padding: 20px !important;
+ border-radius: 0 0 8px 8px !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container .auth-wrapper {
+ border-radius: 0 !important;
+ background-color: transparent !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container input,
+.swagger-ui .modal-ux-content .auth-container textarea {
+ border-radius: 6px !important;
+ background-color: #ffffff !important;
+ border: 1px solid rgba(0, 0, 0, 0.2) !important;
+ padding: 10px 12px !important;
+ font-size: 14px !important;
+ color: #1a1d29 !important;
+ transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
+ width: 100% !important;
+ box-sizing: border-box !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container input:focus,
+.swagger-ui .modal-ux-content .auth-container textarea:focus {
+ outline: none !important;
+ border-color: #3b82f6 !important;
+ box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container input::placeholder,
+.swagger-ui .modal-ux-content .auth-container textarea::placeholder {
+ color: rgba(59, 65, 81, 0.5) !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container .btn-done,
+.swagger-ui .modal-ux-content .auth-container .btn-cancel,
+.swagger-ui .modal-ux-content .btn-done,
+.swagger-ui .modal-ux-content .btn-cancel,
+.swagger-ui .modal-btn.auth.authorize,
+.swagger-ui .modal-btn.auth.btn-done,
+.swagger-ui .btn.modal-btn.auth.authorize,
+.swagger-ui .btn.modal-btn.auth.btn-done {
+ border-radius: 6px !important;
+ padding: 10px 20px !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+ cursor: pointer !important;
+ transition: all 0.2s ease !important;
+ border: 1px solid rgba(0, 0, 0, 0.2) !important;
+ min-width: 100px !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+ line-height: 1.5 !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container .btn-done,
+.swagger-ui .modal-ux-content .btn-done,
+.swagger-ui .modal-btn.auth.authorize {
+ background-color: #3b82f6 !important;
+ border-color: #3b82f6 !important;
+ color: #ffffff !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container .btn-done:hover,
+.swagger-ui .modal-ux-content .btn-done:hover,
+.swagger-ui .modal-btn.auth.authorize:hover {
+ background-color: #2563eb !important;
+ border-color: #2563eb !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3) !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container .btn-cancel,
+.swagger-ui .modal-ux-content .btn-cancel,
+.swagger-ui .modal-btn.auth.btn-done {
+ background-color: #ffffff !important;
+ border-color: rgba(0, 0, 0, 0.2) !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container .btn-cancel:hover,
+.swagger-ui .modal-ux-content .btn-cancel:hover,
+.swagger-ui .modal-btn.auth.btn-done:hover {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+ border-color: rgba(0, 0, 0, 0.3) !important;
+}
+
+.swagger-ui .modal-ux-content p,
+.swagger-ui .modal-ux-content div,
+.swagger-ui .modal-ux-content span {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .modal-ux-content h1,
+.swagger-ui .modal-ux-content h2,
+.swagger-ui .modal-ux-content h3,
+.swagger-ui .modal-ux-content h4 {
+ color: #1a1d29 !important;
+ margin-top: 0 !important;
+ margin-bottom: 12px !important;
+}
+
+.swagger-ui .modal-ux-content h1 {
+ font-size: 24px !important;
+ font-weight: 700 !important;
+ margin-bottom: 16px !important;
+}
+
+.swagger-ui .modal-ux-content h2 {
+ font-size: 20px !important;
+ font-weight: 600 !important;
+ margin-top: 24px !important;
+ margin-bottom: 12px !important;
+}
+
+.swagger-ui .modal-ux-content h3 {
+ font-size: 18px !important;
+ font-weight: 600 !important;
+ margin-top: 20px !important;
+ margin-bottom: 10px !important;
+}
+
+.swagger-ui .modal-ux-content h4 {
+ font-size: 16px !important;
+ font-weight: 600 !important;
+ margin-top: 16px !important;
+ margin-bottom: 8px !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container label {
+ display: block !important;
+ font-weight: 500 !important;
+ color: #1a1d29 !important;
+ margin-bottom: 8px !important;
+ font-size: 14px !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container p {
+ margin: 12px 0 !important;
+ color: #3b4151 !important;
+ line-height: 1.6 !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container ul,
+.swagger-ui .modal-ux-content .auth-container ol {
+ margin: 12px 0 !important;
+ padding-left: 24px !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container li {
+ margin: 6px 0 !important;
+ line-height: 1.6 !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container .auth-btn-wrapper,
+.swagger-ui .modal-ux-content .auth-container .button-wrapper {
+ display: flex !important;
+ gap: 12px !important;
+ margin-top: 20px !important;
+ justify-content: flex-end !important;
+ flex-wrap: wrap !important;
}
-.swagger-ui .opblock .opblock-section-header {
- background: hsla(270, 2%, 19%, 0.3);
+.swagger-ui .modal-ux-content .auth-container .auth-btn-wrapper .btn-done,
+.swagger-ui .modal-ux-content .auth-container .auth-btn-wrapper .btn-cancel,
+.swagger-ui .modal-ux-content .auth-container .button-wrapper .btn-done,
+.swagger-ui .modal-ux-content .auth-container .button-wrapper .btn-cancel {
+ margin: 0 !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container code {
+ background-color: rgba(0, 0, 0, 0.06) !important;
+ color: #1a1d29 !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ font-size: 13px !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+}
+
+.swagger-ui .modal-ux-content .auth-container strong {
+ color: #1a1d29 !important;
+ font-weight: 600 !important;
+}
+
+.swagger-ui .modal-ux-content code {
+ background-color: rgba(0, 0, 0, 0.08) !important;
+ color: #3b4151 !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui .modal-ux-content pre {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+ color: #3b4151 !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui .modal-ux-content ul,
+.swagger-ui .modal-ux-content ol {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .modal-ux-content li {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .modal-ux-content strong {
+ color: #1a1d29 !important;
+}
+
+/* Button styles moved above to auth-container section */
+
+/* Keep original Swagger UI background for opblock-section-header */
+
+/* Version stamps and tags - remove inner parts, keep outer styling */
+.swagger-ui .version,
+.swagger-ui pre.version,
+.swagger-ui .version-stamp,
+.swagger-ui small.version-stamp,
+.swagger-ui version_stamp,
+.swagger-ui openapi_version,
+.swagger-ui .info .title small,
+.swagger-ui .info .title pre.version {
+ /* Keep outer styling - let Swagger UI defaults apply */
+ margin: 0 0.5em 0 0 !important;
+ padding-left: 6px !important;
+}
+
+.swagger-ui .version *,
+.swagger-ui pre.version *,
+.swagger-ui .version-stamp *,
+.swagger-ui version_stamp *,
+.swagger-ui openapi_version *,
+.swagger-ui .info .title small *,
+.swagger-ui .info .title pre.version * {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+}
+
+.swagger-ui .version::before,
+.swagger-ui .version::after,
+.swagger-ui pre.version::before,
+.swagger-ui pre.version::after,
+.swagger-ui .version-stamp::before,
+.swagger-ui .version-stamp::after,
+.swagger-ui version_stamp::before,
+.swagger-ui version_stamp::after,
+.swagger-ui openapi_version::before,
+.swagger-ui openapi_version::after,
+.swagger-ui .info .title small::before,
+.swagger-ui .info .title small::after,
+.swagger-ui .info .title pre.version::before,
+.swagger-ui .info .title pre.version::after {
+ display: none !important;
+ content: none !important;
+}
+
+/* Target any nested spans or divs inside version elements */
+.swagger-ui .info .title small span,
+.swagger-ui .info .title pre.version span,
+.swagger-ui version_stamp span,
+.swagger-ui openapi_version span,
+.swagger-ui .info .title small div,
+.swagger-ui .info .title pre.version div {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+}
+
+/* Only remove inner parts - keep outer badge styling */
+/* Target nested elements inside version badges, but not the badges themselves */
+.swagger-ui .info .title small > *,
+.swagger-ui .info .title pre.version > *,
+.swagger-ui version_stamp > *,
+.swagger-ui openapi_version > * {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+}
+
+/* Header section styling - Light mode */
+.swagger-ui .info {
+ margin: 20px 0;
}
-/* Improve visibility of Swagger UI title, version, and description */
.swagger-ui .info .title,
.swagger-ui .topbar .topbar-wrapper span,
-.swagger-ui .info h1,
+.swagger-ui .info h1 {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .info .title {
+ font-size: 36px !important;
+ font-weight: 600 !important;
+ margin-bottom: 8px !important;
+ margin-right: 16px !important;
+ color: #3b4151 !important;
+ line-height: 1.2 !important;
+}
+
+.swagger-ui .info .title small {
+ font-size: 18px !important;
+ font-weight: 400 !important;
+ color: rgba(59, 65, 81, 0.8) !important;
+ margin-left: 12px !important;
+}
+
+.swagger-ui .info .title small pre {
+ background: transparent !important;
+ color: rgba(59, 65, 81, 0.8) !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ font-size: 18px !important;
+}
+
+.swagger-ui .info .description,
.swagger-ui .info p {
- color: #ffffff !important;
+ color: #3b4151 !important;
+ font-size: 16px !important;
+ line-height: 1.6 !important;
+}
+
+.swagger-ui .info .description {
+ margin-top: 12px !important;
+ margin-bottom: 20px !important;
+}
+
+/* Topbar styling - Light mode */
+.swagger-ui .topbar {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui .topbar .topbar-wrapper {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .topbar .topbar-wrapper span {
+ color: #3b4151 !important;
+}
+
+/* Authorize button styling - Light mode */
+.swagger-ui .btn.authorize {
+ background-color: rgba(0, 0, 0, 0.1) !important;
+ border-color: rgba(0, 0, 0, 0.2) !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .btn.authorize:hover {
+ background-color: rgba(0, 0, 0, 0.15) !important;
+ border-color: rgba(0, 0, 0, 0.3) !important;
}
+
.swagger-ui .scheme-container {
- background: rgba(255, 255, 255, 0.05) !important;
+ background: rgba(0, 0, 0, 0.03) !important;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
- border: 1px solid rgba(255, 255, 255, 0.1);
+ border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 12px;
- box-shadow: 0 0 16px rgba(0, 0, 0, 0.2);
-}
\ No newline at end of file
+ box-shadow: 0 0 16px rgba(0, 0, 0, 0.1);
+ padding: 16px !important;
+ margin: 20px 0 !important;
+ display: flex !important;
+ flex-direction: column !important;
+ gap: 12px !important;
+}
+
+/* Auth info text next to authorize button - Light mode */
+.swagger-ui .scheme-container .auth-info-text {
+ display: flex !important;
+ align-items: center !important;
+ gap: 8px !important;
+ padding: 8px 12px !important;
+ background-color: rgba(59, 130, 246, 0.1) !important;
+ border: 1px solid rgba(59, 130, 246, 0.2) !important;
+ border-radius: 6px !important;
+ font-size: 13px !important;
+ color: #3b4151 !important;
+ margin-top: 8px !important;
+}
+
+/* Token generator tooltip button - Light mode */
+.swagger-ui .token-generator-tooltip {
+ display: inline-block !important;
+ margin-left: 12px !important;
+}
+
+.swagger-ui .token-generator-btn {
+ padding: 6px 12px !important;
+ background-color: rgba(59, 130, 246, 0.1) !important;
+ border: 1px solid rgba(59, 130, 246, 0.3) !important;
+ border-radius: 6px !important;
+ color: #3b82f6 !important;
+ font-size: 13px !important;
+ font-weight: 500 !important;
+ cursor: pointer !important;
+ transition: all 0.2s ease !important;
+}
+
+.swagger-ui .token-generator-btn:hover {
+ background-color: rgba(59, 130, 246, 0.2) !important;
+ border-color: rgba(59, 130, 246, 0.4) !important;
+}
+
+.swagger-ui .token-generator-btn:disabled {
+ opacity: 0.6 !important;
+ cursor: not-allowed !important;
+}
+
+/* Wallet connect hint - Light mode */
+.swagger-ui .wallet-connect-hint {
+ display: inline-block !important;
+ margin-left: 12px !important;
+}
+
+.swagger-ui .wallet-connect-hint-text {
+ display: flex !important;
+ align-items: center !important;
+ gap: 8px !important;
+ padding: 6px 12px !important;
+ background-color: rgba(251, 191, 36, 0.1) !important;
+ border: 1px solid rgba(251, 191, 36, 0.3) !important;
+ border-radius: 6px !important;
+ font-size: 13px !important;
+ color: #92400e !important;
+}
+
+.swagger-ui .wallet-connect-hint-text .wallet-hint-icon {
+ font-size: 16px !important;
+ flex-shrink: 0 !important;
+}
+
+.swagger-ui .wallet-connect-hint-text .wallet-hint-content {
+ flex: 1 !important;
+ line-height: 1.4 !important;
+}
+
+.swagger-ui .scheme-container .auth-info-text .auth-info-icon {
+ font-size: 16px !important;
+ flex-shrink: 0 !important;
+}
+
+.swagger-ui .scheme-container .auth-info-text .auth-info-content {
+ flex: 1 !important;
+ line-height: 1.4 !important;
+}
+
+.swagger-ui .scheme-container .auth-info-text code {
+ background-color: rgba(0, 0, 0, 0.08) !important;
+ color: #3b4151 !important;
+ padding: 2px 4px !important;
+ border-radius: 3px !important;
+ font-size: 12px !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui .info .base-url {
+ color: rgba(59, 65, 81, 0.7) !important;
+ font-size: 14px !important;
+}
+
+/* Code blocks in description - Light mode */
+.swagger-ui .info pre {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+ color: #3b4151 !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+ border-radius: 4px !important;
+ padding: 8px !important;
+}
+
+/* Links - Light mode */
+.swagger-ui .info a {
+ color: #3b4151 !important;
+ text-decoration: underline !important;
+}
+
+.swagger-ui .info a:hover {
+ color: #1a1d29 !important;
+}
+
+/* API Docs wrapper container - Light mode */
+.api-docs-wrapper {
+ background-color: rgba(255, 255, 255, 0.75) !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+ box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15) !important;
+}
+
+@media (prefers-color-scheme: dark) {
+ .api-docs-wrapper {
+ background-color: rgba(255, 255, 255, 0.03) !important;
+ border: 1px solid rgba(255, 255, 255, 0.15) !important;
+ box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3) !important;
+ }
+}
+
+html.dark .api-docs-wrapper {
+ background-color: rgba(255, 255, 255, 0.03) !important;
+ border: 1px solid rgba(255, 255, 255, 0.15) !important;
+ box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3) !important;
+}
+
+/* Overall Swagger UI container */
+.swagger-ui {
+ background: transparent !important;
+}
+
+.swagger-ui .wrapper {
+ padding: 0 !important;
+}
+
+/* Markdown content in description - Light mode */
+.swagger-ui .info .description {
+ max-width: 100% !important;
+}
+
+.swagger-ui .info .description h1,
+.swagger-ui .info .description h2,
+.swagger-ui .info .description h3,
+.swagger-ui .info .description h4 {
+ color: #3b4151 !important;
+ font-weight: 600 !important;
+ margin-top: 24px !important;
+ margin-bottom: 12px !important;
+ line-height: 1.3 !important;
+}
+
+.swagger-ui .info .description h1 {
+ font-size: 28px !important;
+ border-bottom: 2px solid rgba(0, 0, 0, 0.1) !important;
+ padding-bottom: 8px !important;
+}
+
+.swagger-ui .info .description h2 {
+ font-size: 24px !important;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
+ padding-bottom: 6px !important;
+}
+
+.swagger-ui .info .description h3 {
+ font-size: 20px !important;
+}
+
+.swagger-ui .info .description h4 {
+ font-size: 18px !important;
+}
+
+.swagger-ui .info .description p {
+ margin: 12px 0 !important;
+ line-height: 1.7 !important;
+}
+
+.swagger-ui .info .description ul,
+.swagger-ui .info .description ol {
+ margin: 12px 0 !important;
+ padding-left: 24px !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .info .description li {
+ margin: 6px 0 !important;
+ color: #3b4151 !important;
+ line-height: 1.7 !important;
+}
+
+.swagger-ui .info .description li::marker {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .info .description strong {
+ color: #1a1d29 !important;
+ font-weight: 600 !important;
+}
+
+.swagger-ui .info .description code {
+ background-color: rgba(0, 0, 0, 0.08) !important;
+ color: #3b4151 !important;
+ padding: 2px 6px !important;
+ border-radius: 6px !important;
+ font-size: 14px !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui .info .description pre {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+ border-radius: 8px !important;
+ padding: 12px !important;
+ overflow-x: auto !important;
+}
+
+/* Code blocks and syntax highlighting - Light mode */
+.swagger-ui pre,
+.swagger-ui .example,
+.swagger-ui .microlight,
+.swagger-ui pre.example,
+.swagger-ui pre.microlight {
+ border-radius: 8px !important;
+ overflow: hidden !important;
+}
+
+.swagger-ui .info .description pre code {
+ background-color: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+}
+
+/* Dark mode styles */
+@media (prefers-color-scheme: dark) {
+ .swagger-ui .scheme-container,
+ .swagger-ui .opblock-tag,
+ .swagger-ui .opblock-summary-description,
+ .swagger-ui .opblock-summary-path,
+ .swagger-ui .response-col_status {
+ color: #ffffff !important;
+ }
+
+ /* Keep original Swagger UI background for opblock-section-header */
+
+ /* Version stamps and tags - remove inner parts, keep outer styling - Dark mode */
+ .swagger-ui .version,
+ .swagger-ui pre.version,
+ .swagger-ui .version-stamp,
+ .swagger-ui small.version-stamp,
+ .swagger-ui version_stamp,
+ .swagger-ui openapi_version,
+ .swagger-ui .info .title small,
+ .swagger-ui .info .title pre.version {
+ /* Keep outer styling - let Swagger UI defaults apply */
+ margin: 0 0.5em 0 0 !important;
+ padding-left: 6px !important;
+ }
+
+ .swagger-ui .version *,
+ .swagger-ui pre.version *,
+ .swagger-ui .version-stamp *,
+ .swagger-ui version_stamp *,
+ .swagger-ui openapi_version *,
+ .swagger-ui .info .title small *,
+ .swagger-ui .info .title pre.version * {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+ }
+
+ .swagger-ui .version::before,
+ .swagger-ui .version::after,
+ .swagger-ui pre.version::before,
+ .swagger-ui pre.version::after,
+ .swagger-ui .version-stamp::before,
+ .swagger-ui .version-stamp::after,
+ .swagger-ui version_stamp::before,
+ .swagger-ui version_stamp::after,
+ .swagger-ui openapi_version::before,
+ .swagger-ui openapi_version::after,
+ .swagger-ui .info .title small::before,
+ .swagger-ui .info .title small::after,
+ .swagger-ui .info .title pre.version::before,
+ .swagger-ui .info .title pre.version::after {
+ display: none !important;
+ content: none !important;
+ }
+
+ /* Target any nested spans or divs inside version elements */
+ .swagger-ui .info .title small span,
+ .swagger-ui .info .title pre.version span,
+ .swagger-ui version_stamp span,
+ .swagger-ui openapi_version span,
+ .swagger-ui .info .title small div,
+ .swagger-ui .info .title pre.version div {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+ }
+
+ /* Only remove inner parts - keep outer badge styling */
+ /* Target nested elements inside version badges, but not the badges themselves */
+ .swagger-ui .info .title small > *,
+ .swagger-ui .info .title pre.version > *,
+ .swagger-ui version_stamp > *,
+ .swagger-ui openapi_version > * {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+ }
+
+ .swagger-ui .info .title,
+ .swagger-ui .topbar .topbar-wrapper span,
+ .swagger-ui .info h1 {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .info .title {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .info .title small {
+ color: rgba(255, 255, 255, 0.8) !important;
+ }
+
+ .swagger-ui .info .title small pre {
+ color: rgba(255, 255, 255, 0.8) !important;
+ }
+
+ .swagger-ui .info .description,
+ .swagger-ui .info p {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .topbar {
+ background-color: rgba(0, 0, 0, 0.2) !important;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .topbar .topbar-wrapper {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .topbar .topbar-wrapper span {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .btn.authorize {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .btn.authorize:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+ }
+
+ .swagger-ui .scheme-container {
+ background: rgba(255, 255, 255, 0.05) !important;
+ border: 1px solid rgba(255, 255, 255, 0.1);
+ box-shadow: 0 0 16px rgba(0, 0, 0, 0.2);
+ }
+
+ /* Auth info text - Dark mode */
+ .swagger-ui .scheme-container .auth-info-text {
+ background-color: rgba(59, 130, 246, 0.15) !important;
+ border-color: rgba(59, 130, 246, 0.3) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ /* Token generator tooltip button - Dark mode */
+ .swagger-ui .token-generator-btn {
+ background-color: rgba(59, 130, 246, 0.15) !important;
+ border-color: rgba(59, 130, 246, 0.3) !important;
+ color: #60a5fa !important;
+ }
+
+ .swagger-ui .token-generator-btn:hover {
+ background-color: rgba(59, 130, 246, 0.25) !important;
+ border-color: rgba(59, 130, 246, 0.4) !important;
+ }
+
+ /* Wallet connect hint - Dark mode */
+ .swagger-ui .wallet-connect-hint-text {
+ background-color: rgba(251, 191, 36, 0.15) !important;
+ border-color: rgba(251, 191, 36, 0.3) !important;
+ color: #fbbf24 !important;
+ }
+
+ .swagger-ui .scheme-container .auth-info-text code {
+ background-color: rgba(0, 0, 0, 0.4) !important;
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .info .base-url {
+ color: rgba(255, 255, 255, 0.7) !important;
+ }
+
+ .swagger-ui .info pre {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: #ffffff !important;
+ border: 1px solid rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .info a {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .info a:hover {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .auth-wrapper {
+ background-color: rgba(255, 255, 255, 0.1);
+ }
+
+ /* Authorization modal/popup - Dark mode */
+ .swagger-ui .modal-ux,
+ .swagger-ui .modal-ux-backdrop {
+ background-color: rgba(0, 0, 0, 0.7) !important;
+ }
+
+ .swagger-ui .modal-ux-content {
+ background-color: rgba(30, 30, 30, 0.95) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ border: 1px solid rgba(255, 255, 255, 0.1) !important;
+ backdrop-filter: blur(16px) !important;
+ -webkit-backdrop-filter: blur(16px) !important;
+ max-height: 90vh !important;
+ max-width: 600px !important;
+ width: calc(100% - 32px) !important;
+ margin: 0 auto !important;
+ overflow-y: auto !important;
+ overflow-x: hidden !important;
+ }
+
+ .swagger-ui .modal-ux-header {
+ background-color: rgba(30, 30, 30, 0.95) !important;
+ color: #ffffff !important;
+ border-bottom-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .modal-ux-header h3,
+ .swagger-ui .modal-ux-header h4,
+ .swagger-ui .modal-ux-header div {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .modal-ux-header .close-modal {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .modal-ux-header .close-modal:hover {
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container {
+ color: rgba(255, 255, 255, 0.9) !important;
+ padding: 20px !important;
+ background-color: rgba(30, 30, 30, 0.95) !important;
+ border-radius: 0 0 8px 8px !important;
+ }
+
+ .swagger-ui .modal-ux-content > div:not(.modal-ux-header) {
+ padding: 20px !important;
+ border-radius: 0 0 8px 8px !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container .auth-wrapper {
+ border-radius: 0 !important;
+ background-color: transparent !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container input,
+ .swagger-ui .modal-ux-content .auth-container textarea {
+ border-radius: 6px !important;
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ border: 1px solid rgba(255, 255, 255, 0.2) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ padding: 10px 12px !important;
+ font-size: 14px !important;
+ transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
+ width: 100% !important;
+ box-sizing: border-box !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container input:focus,
+ .swagger-ui .modal-ux-content .auth-container textarea:focus {
+ outline: none !important;
+ border-color: #60a5fa !important;
+ box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.2) !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container input::placeholder,
+ .swagger-ui .modal-ux-content .auth-container textarea::placeholder {
+ color: rgba(255, 255, 255, 0.5) !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container .btn-done,
+ .swagger-ui .modal-ux-content .auth-container .btn-cancel,
+ .swagger-ui .modal-ux-content .btn-done,
+ .swagger-ui .modal-ux-content .btn-cancel,
+ .swagger-ui .modal-btn.auth.authorize,
+ .swagger-ui .modal-btn.auth.btn-done,
+ .swagger-ui .btn.modal-btn.auth.authorize,
+ .swagger-ui .btn.modal-btn.auth.btn-done {
+ border-radius: 6px !important;
+ padding: 10px 20px !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+ cursor: pointer !important;
+ transition: all 0.2s ease !important;
+ min-width: 100px !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+ line-height: 1.5 !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container .btn-done,
+ .swagger-ui .modal-ux-content .btn-done,
+ .swagger-ui .modal-btn.auth.authorize {
+ background-color: #3b82f6 !important;
+ border-color: #3b82f6 !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container .btn-done:hover,
+ .swagger-ui .modal-ux-content .btn-done:hover,
+ .swagger-ui .modal-btn.auth.authorize:hover {
+ background-color: #2563eb !important;
+ border-color: #2563eb !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3) !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container .btn-cancel,
+ .swagger-ui .modal-ux-content .btn-cancel,
+ .swagger-ui .modal-btn.auth.btn-done {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container .btn-cancel:hover,
+ .swagger-ui .modal-ux-content .btn-cancel:hover,
+ .swagger-ui .modal-btn.auth.btn-done:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container label {
+ display: block !important;
+ font-weight: 500 !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ margin-bottom: 8px !important;
+ font-size: 14px !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container .auth-btn-wrapper,
+ .swagger-ui .modal-ux-content .auth-container .button-wrapper {
+ display: flex !important;
+ gap: 12px !important;
+ margin-top: 20px !important;
+ justify-content: flex-end !important;
+ flex-wrap: wrap !important;
+ }
+
+ .swagger-ui .modal-ux-content .auth-container code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: #ffffff !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ font-size: 13px !important;
+ }
+
+ .swagger-ui .modal-ux-content p,
+ .swagger-ui .modal-ux-content div,
+ .swagger-ui .modal-ux-content span {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .modal-ux-content h1,
+ .swagger-ui .modal-ux-content h2,
+ .swagger-ui .modal-ux-content h3,
+ .swagger-ui .modal-ux-content h4 {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .modal-ux-content h1 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+ }
+
+ .swagger-ui .modal-ux-content h2 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+ }
+
+ .swagger-ui .modal-ux-content code {
+ background-color: rgba(0, 0, 0, 0.4) !important;
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .modal-ux-content pre {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .modal-ux-content pre code {
+ background-color: transparent !important;
+ border: none !important;
+ }
+
+ .swagger-ui .modal-ux-content ul,
+ .swagger-ui .modal-ux-content ol {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .modal-ux-content li {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .modal-ux-content li::marker {
+ color: rgba(255, 255, 255, 0.7) !important;
+ }
+
+ .swagger-ui .modal-ux-content strong {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .modal-ux-content .btn-done,
+ .swagger-ui .modal-ux-content .btn-cancel {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .modal-ux-content .btn-done:hover,
+ .swagger-ui .modal-ux-content .btn-cancel:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+ }
+
+ /* Form inputs and fields - Dark mode */
+ .swagger-ui input,
+ .swagger-ui .auth-wrapper input,
+ .swagger-ui textarea,
+ .swagger-ui select {
+ color: #ffffff !important;
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border: 1px solid rgba(255, 255, 255, 0.2) !important;
+ }
+
+ .swagger-ui input:focus,
+ .swagger-ui textarea:focus,
+ .swagger-ui select:focus {
+ border-color: rgba(255, 255, 255, 0.4) !important;
+ box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui input::placeholder,
+ .swagger-ui textarea::placeholder {
+ color: rgba(255, 255, 255, 0.5) !important;
+ }
+
+ /* Labels and form labels - Dark mode */
+ .swagger-ui label,
+ .swagger-ui .parameter__extension,
+ .swagger-ui .parameter__deprecated {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ /* Section headers - Dark mode */
+ .swagger-ui .opblock-section-header h4,
+ .swagger-ui .opblock-section-header label,
+ .swagger-ui h4,
+ .swagger-ui .parameters-container h4,
+ .swagger-ui .responses-inner h4,
+ .swagger-ui .opblock-section-header span,
+ .swagger-ui .opblock-section-header .opblock-section-header-title {
+ color: #ffffff !important;
+ }
+
+ /* Parameters section specifically - Dark mode */
+ .swagger-ui .parameters-container > h4,
+ .swagger-ui .parameters-container > label,
+ .swagger-ui .parameters-container > span,
+ .swagger-ui .parameters-container h4 span {
+ color: #ffffff !important;
+ }
+
+ /* Buttons - Dark mode */
+ .swagger-ui .btn,
+ .swagger-ui button,
+ .swagger-ui .execute,
+ .swagger-ui .btn-cancel,
+ .swagger-ui .btn-done,
+ .swagger-ui .btn-clear {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .btn:hover,
+ .swagger-ui button:hover,
+ .swagger-ui .execute:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+ }
+
+ .swagger-ui .btn.execute {
+ background-color: #3b82f6 !important;
+ border-color: #2563eb !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .btn.execute:hover {
+ background-color: #2563eb !important;
+ }
+
+ /* Checkboxes and radio buttons - Dark mode */
+ .swagger-ui input[type="checkbox"],
+ .swagger-ui input[type="radio"] {
+ accent-color: #3b82f6 !important;
+ }
+
+ /* Select dropdowns - Dark mode */
+ .swagger-ui select {
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
+ }
+
+ /* Parameter sections - Dark mode */
+ .swagger-ui .parameters-container,
+ .swagger-ui .parameters-col_description {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .parameter__required {
+ color: #f87171 !important;
+ }
+
+ /* Response sections - Dark mode */
+ .swagger-ui .response {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ /* Unified Response Section Styling - Dark mode */
+ .swagger-ui .responses-wrapper,
+ .swagger-ui .responses-inner {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ }
+
+ /* Unified code block style - dark mode */
+ .swagger-ui .curl,
+ .swagger-ui .curl-command,
+ .swagger-ui .request-snippets,
+ .swagger-ui .request-url,
+ .swagger-ui .response-body,
+ .swagger-ui .response-body-content,
+ .swagger-ui .response-headers,
+ .swagger-ui .highlight-code,
+ .swagger-ui pre.microlight,
+ .swagger-ui pre.example {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border: 1px solid rgba(255, 255, 255, 0.1) !important;
+ border-radius: 6px !important;
+ padding: 12px 16px !important;
+ margin: 12px 0 !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ font-size: 13px !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ line-height: 1.6 !important;
+ overflow-x: auto !important;
+ word-break: break-all !important;
+ }
+
+ /* Code elements within response sections - dark mode */
+ .swagger-ui .curl code,
+ .swagger-ui .curl-command code,
+ .swagger-ui .request-snippets code,
+ .swagger-ui .request-url code,
+ .swagger-ui .response-body code,
+ .swagger-ui .response-body-content code,
+ .swagger-ui .response-headers code,
+ .swagger-ui .highlight-code code,
+ .swagger-ui pre code {
+ background-color: transparent !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ padding: 0 !important;
+ border: none !important;
+ font-family: inherit !important;
+ }
+
+ /* Pre elements - dark mode */
+ .swagger-ui .response-body pre,
+ .swagger-ui .response-body-content pre,
+ .swagger-ui .highlight-code pre,
+ .swagger-ui pre.microlight,
+ .swagger-ui pre.example {
+ background-color: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ font-family: inherit !important;
+ }
+
+ /* Response headers table - dark mode */
+ .swagger-ui .response-headers table {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background-color: transparent !important;
+ }
+
+ .swagger-ui .response-headers th,
+ .swagger-ui .response-headers td {
+ padding: 8px 12px !important;
+ text-align: left !important;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ background-color: transparent !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ font-size: 13px !important;
+ }
+
+ .swagger-ui .response-headers th {
+ font-weight: 600 !important;
+ background-color: rgba(255, 255, 255, 0.05) !important;
+ }
+
+ .swagger-ui .response-headers tr:last-child th,
+ .swagger-ui .response-headers tr:last-child td {
+ border-bottom: none !important;
+ }
+
+ /* Unified Syntax Highlighting - Dark mode */
+ .swagger-ui .microlight,
+ .swagger-ui pre.microlight,
+ .swagger-ui pre.example,
+ .swagger-ui .response-body pre,
+ .swagger-ui .response-body-content pre,
+ .swagger-ui .highlight-code pre {
+ color: rgba(255, 255, 255, 0.9) !important;
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ }
+
+ /* String values - dark green for dark mode */
+ .swagger-ui .microlight .string,
+ .swagger-ui .microlight .hljs-string,
+ .swagger-ui .microlight .token.string,
+ .swagger-ui pre .string,
+ .swagger-ui pre .hljs-string,
+ .swagger-ui pre .token.string,
+ .swagger-ui .response-body .string,
+ .swagger-ui .response-body-content .string,
+ .swagger-ui .highlight-code .string,
+ .swagger-ui .highlight-code .hljs-string,
+ .swagger-ui pre.microlight .string,
+ .swagger-ui pre.example .string,
+ .swagger-ui .curl .string,
+ .swagger-ui .request-url .string {
+ color: #059669 !important;
+ }
+
+ /* Number values - light red */
+ .swagger-ui .microlight .number,
+ .swagger-ui .microlight .hljs-number,
+ .swagger-ui .microlight .token.number,
+ .swagger-ui pre .number,
+ .swagger-ui pre .hljs-number,
+ .swagger-ui pre .token.number,
+ .swagger-ui .response-body .number,
+ .swagger-ui .response-body-content .number,
+ .swagger-ui pre.microlight .number,
+ .swagger-ui pre.example .number {
+ color: #f87171 !important;
+ }
+
+ /* Keywords - light purple */
+ .swagger-ui .microlight .keyword,
+ .swagger-ui .microlight .hljs-keyword,
+ .swagger-ui .microlight .token.keyword,
+ .swagger-ui pre .keyword,
+ .swagger-ui pre .hljs-keyword {
+ color: #a78bfa !important;
+ }
+
+ /* Property names - light */
+ .swagger-ui .microlight .property,
+ .swagger-ui .microlight .hljs-attr,
+ .swagger-ui .microlight .token.property,
+ .swagger-ui pre .property,
+ .swagger-ui pre .hljs-attr {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-section {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+ }
+
+ .swagger-ui .opblock-section-header {
+ background-color: rgba(0, 0, 0, 0.2) !important;
+ border-radius: 12px 12px 0 0 !important;
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+ }
+
+ .swagger-ui .opblock-section-header h4 {
+ margin: 0 !important;
+ font-size: 16px !important;
+ font-weight: 600 !important;
+ }
+
+ .swagger-ui .highlight-code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ /* Markdown content in description - Dark mode */
+ .swagger-ui .info .description h1,
+ .swagger-ui .info .description h2,
+ .swagger-ui .info .description h3,
+ .swagger-ui .info .description h4 {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .info .description h1 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+ }
+
+ .swagger-ui .info .description h2 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+ }
+
+ .swagger-ui .info .description ul,
+ .swagger-ui .info .description ol {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .info .description li {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .info .description li::marker {
+ color: rgba(255, 255, 255, 0.7) !important;
+ }
+
+ .swagger-ui .info .description strong {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .info .description code {
+ background-color: rgba(0, 0, 0, 0.4) !important;
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ border-radius: 6px !important;
+ }
+
+ .swagger-ui .info .description pre {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .info .description pre code {
+ background-color: transparent !important;
+ border: none !important;
+ }
+
+ /* Code blocks and syntax highlighting - Dark mode */
+ .swagger-ui pre,
+ .swagger-ui .example,
+ .swagger-ui .microlight,
+ .swagger-ui pre.example,
+ .swagger-ui pre.microlight {
+ border-radius: 8px !important;
+ overflow: hidden !important;
+ }
+}
+
+/* Support for .dark class selector (used by Tailwind) */
+html.dark .swagger-ui .scheme-container,
+html.dark .swagger-ui .opblock-tag,
+html.dark .swagger-ui .opblock-summary-description,
+html.dark .swagger-ui .opblock-summary-path,
+html.dark .swagger-ui .response-col_status {
+ color: #ffffff !important;
+}
+
+/* Keep original Swagger UI background for opblock-section-header */
+
+/* Version stamps and tags - remove inner parts, keep outer styling - Dark class selector */
+html.dark .swagger-ui .version,
+html.dark .swagger-ui pre.version,
+html.dark .swagger-ui .version-stamp,
+html.dark .swagger-ui small.version-stamp,
+html.dark .swagger-ui version_stamp,
+html.dark .swagger-ui openapi_version,
+html.dark .swagger-ui .info .title small,
+html.dark .swagger-ui .info .title pre.version {
+ /* Keep outer styling - let Swagger UI defaults apply */
+ margin: 0 0.5em 0 0 !important;
+ margin-left: 6px !important;
+
+}
+
+html.dark .swagger-ui .version *,
+html.dark .swagger-ui pre.version *,
+html.dark .swagger-ui .version-stamp *,
+html.dark .swagger-ui version_stamp *,
+html.dark .swagger-ui openapi_version *,
+html.dark .swagger-ui .info .title small *,
+html.dark .swagger-ui .info .title pre.version * {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+}
+
+html.dark .swagger-ui .version::before,
+html.dark .swagger-ui .version::after,
+html.dark .swagger-ui pre.version::before,
+html.dark .swagger-ui pre.version::after,
+html.dark .swagger-ui .version-stamp::before,
+html.dark .swagger-ui .version-stamp::after,
+html.dark .swagger-ui version_stamp::before,
+html.dark .swagger-ui version_stamp::after,
+html.dark .swagger-ui openapi_version::before,
+html.dark .swagger-ui openapi_version::after,
+html.dark .swagger-ui .info .title small::before,
+html.dark .swagger-ui .info .title small::after,
+html.dark .swagger-ui .info .title pre.version::before,
+html.dark .swagger-ui .info .title pre.version::after {
+ display: none !important;
+ content: none !important;
+}
+
+/* Target any nested spans or divs inside version elements */
+html.dark .swagger-ui .info .title small span,
+html.dark .swagger-ui .info .title pre.version span,
+html.dark .swagger-ui version_stamp span,
+html.dark .swagger-ui openapi_version span,
+html.dark .swagger-ui .info .title small div,
+html.dark .swagger-ui .info .title pre.version div {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+}
+
+/* Only remove inner parts - keep outer badge styling */
+/* Target nested elements inside version badges, but not the badges themselves */
+html.dark .swagger-ui .info .title small > *,
+html.dark .swagger-ui .info .title pre.version > *,
+html.dark .swagger-ui version_stamp > *,
+html.dark .swagger-ui openapi_version > * {
+ background-color: transparent !important;
+ background: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ box-shadow: none !important;
+ border-radius: 0 !important;
+}
+
+html.dark .swagger-ui .info .title,
+html.dark .swagger-ui .topbar .topbar-wrapper span,
+html.dark .swagger-ui .info h1 {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .info .title {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .info .title small {
+ color: rgba(255, 255, 255, 0.8) !important;
+}
+
+html.dark .swagger-ui .info .title small pre {
+ color: rgba(255, 255, 255, 0.8) !important;
+}
+
+html.dark .swagger-ui .info .description,
+html.dark .swagger-ui .info p {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .topbar {
+ background-color: rgba(0, 0, 0, 0.2) !important;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .topbar .topbar-wrapper {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .topbar .topbar-wrapper span {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .btn.authorize {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .btn.authorize:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+}
+
+html.dark .swagger-ui .scheme-container {
+ background: rgba(255, 255, 255, 0.05) !important;
+ border: 1px solid rgba(255, 255, 255, 0.1);
+ box-shadow: 0 0 16px rgba(0, 0, 0, 0.2);
+}
+
+/* Auth info text - Dark class selector */
+html.dark .swagger-ui .scheme-container .auth-info-text {
+ background-color: rgba(59, 130, 246, 0.15) !important;
+ border-color: rgba(59, 130, 246, 0.3) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+/* Token generator tooltip button - Dark class selector */
+html.dark .swagger-ui .token-generator-btn {
+ background-color: rgba(59, 130, 246, 0.15) !important;
+ border-color: rgba(59, 130, 246, 0.3) !important;
+ color: #60a5fa !important;
+}
+
+html.dark .swagger-ui .token-generator-btn:hover {
+ background-color: rgba(59, 130, 246, 0.25) !important;
+ border-color: rgba(59, 130, 246, 0.4) !important;
+}
+
+/* Wallet connect hint - Dark class selector */
+html.dark .swagger-ui .wallet-connect-hint-text {
+ background-color: rgba(251, 191, 36, 0.15) !important;
+ border-color: rgba(251, 191, 36, 0.3) !important;
+ color: #fbbf24 !important;
+}
+
+html.dark .swagger-ui .scheme-container .auth-info-text code {
+ background-color: rgba(0, 0, 0, 0.4) !important;
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .info .base-url {
+ color: rgba(255, 255, 255, 0.7) !important;
+}
+
+html.dark .swagger-ui .info pre {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: #ffffff !important;
+ border: 1px solid rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .info a {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .info a:hover {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .auth-wrapper {
+ background-color: rgba(255, 255, 255, 0.1);
+}
+
+/* Authorization modal/popup - Dark class selector */
+html.dark .swagger-ui .modal-ux,
+html.dark .swagger-ui .modal-ux-backdrop {
+ background-color: rgba(0, 0, 0, 0.7) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content {
+ background-color: rgba(30, 30, 30, 0.95) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ border: 1px solid rgba(255, 255, 255, 0.1) !important;
+ backdrop-filter: blur(16px) !important;
+ -webkit-backdrop-filter: blur(16px) !important;
+ max-height: 90vh !important;
+ max-width: 600px !important;
+ width: calc(100% - 32px) !important;
+ margin: 0 auto !important;
+ overflow-y: auto !important;
+ overflow-x: hidden !important;
+}
+
+html.dark .swagger-ui .modal-ux-header {
+ background-color: rgba(30, 30, 30, 0.95) !important;
+ color: #ffffff !important;
+ border-bottom-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .modal-ux-header h3,
+html.dark .swagger-ui .modal-ux-header h4,
+html.dark .swagger-ui .modal-ux-header div {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .modal-ux-header .close-modal {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .modal-ux-header .close-modal:hover {
+ background-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container {
+ color: rgba(255, 255, 255, 0.9) !important;
+ padding: 20px !important;
+ background-color: rgba(30, 30, 30, 0.95) !important;
+ border-radius: 0 0 8px 8px !important;
+}
+
+html.dark .swagger-ui .modal-ux-content > div:not(.modal-ux-header) {
+ padding: 20px !important;
+ border-radius: 0 0 8px 8px !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container .auth-wrapper {
+ border-radius: 0 !important;
+ background-color: transparent !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container input,
+html.dark .swagger-ui .modal-ux-content .auth-container textarea {
+ border-radius: 6px !important;
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ border: 1px solid rgba(255, 255, 255, 0.2) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ padding: 10px 12px !important;
+ font-size: 14px !important;
+ transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
+ width: 100% !important;
+ box-sizing: border-box !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container input:focus,
+html.dark .swagger-ui .modal-ux-content .auth-container textarea:focus {
+ outline: none !important;
+ border-color: #60a5fa !important;
+ box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.2) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container input::placeholder,
+html.dark .swagger-ui .modal-ux-content .auth-container textarea::placeholder {
+ color: rgba(255, 255, 255, 0.5) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container .btn-done,
+html.dark .swagger-ui .modal-ux-content .auth-container .btn-cancel,
+html.dark .swagger-ui .modal-ux-content .btn-done,
+html.dark .swagger-ui .modal-ux-content .btn-cancel,
+html.dark .swagger-ui .modal-btn.auth.authorize,
+html.dark .swagger-ui .modal-btn.auth.btn-done,
+html.dark .swagger-ui .btn.modal-btn.auth.authorize,
+html.dark .swagger-ui .btn.modal-btn.auth.btn-done {
+ border-radius: 6px !important;
+ padding: 10px 20px !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+ cursor: pointer !important;
+ transition: all 0.2s ease !important;
+ min-width: 100px !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ text-align: center !important;
+ vertical-align: middle !important;
+ line-height: 1.5 !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container .btn-done,
+html.dark .swagger-ui .modal-ux-content .btn-done,
+html.dark .swagger-ui .modal-btn.auth.authorize {
+ background-color: #3b82f6 !important;
+ border-color: #3b82f6 !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container .btn-done:hover,
+html.dark .swagger-ui .modal-ux-content .btn-done:hover,
+html.dark .swagger-ui .modal-btn.auth.authorize:hover {
+ background-color: #2563eb !important;
+ border-color: #2563eb !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container .btn-cancel,
+html.dark .swagger-ui .modal-ux-content .btn-cancel,
+html.dark .swagger-ui .modal-btn.auth.btn-done {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container .btn-cancel:hover,
+html.dark .swagger-ui .modal-ux-content .btn-cancel:hover,
+html.dark .swagger-ui .modal-btn.auth.btn-done:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container label {
+ display: block !important;
+ font-weight: 500 !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ margin-bottom: 8px !important;
+ font-size: 14px !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container .auth-btn-wrapper,
+html.dark .swagger-ui .modal-ux-content .auth-container .button-wrapper {
+ display: flex !important;
+ gap: 12px !important;
+ margin-top: 20px !important;
+ justify-content: flex-end !important;
+ flex-wrap: wrap !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .auth-container code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: #ffffff !important;
+ padding: 2px 6px !important;
+ border-radius: 4px !important;
+ font-size: 13px !important;
+}
+
+html.dark .swagger-ui .modal-ux-content p,
+html.dark .swagger-ui .modal-ux-content div,
+html.dark .swagger-ui .modal-ux-content span {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content h1,
+html.dark .swagger-ui .modal-ux-content h2,
+html.dark .swagger-ui .modal-ux-content h3,
+html.dark .swagger-ui .modal-ux-content h4 {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .modal-ux-content h1 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content h2 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content code {
+ background-color: rgba(0, 0, 0, 0.4) !important;
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content pre {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content pre code {
+ background-color: transparent !important;
+ border: none !important;
+}
+
+html.dark .swagger-ui .modal-ux-content ul,
+html.dark .swagger-ui .modal-ux-content ol {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content li {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content li::marker {
+ color: rgba(255, 255, 255, 0.7) !important;
+}
+
+html.dark .swagger-ui .modal-ux-content strong {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .btn-done,
+html.dark .swagger-ui .modal-ux-content .btn-cancel {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .modal-ux-content .btn-done:hover,
+html.dark .swagger-ui .modal-ux-content .btn-cancel:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+}
+
+/* Form inputs and fields - Dark class selector */
+html.dark .swagger-ui input,
+html.dark .swagger-ui .auth-wrapper input,
+html.dark .swagger-ui textarea,
+html.dark .swagger-ui select {
+ color: #ffffff !important;
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border: 1px solid rgba(255, 255, 255, 0.2) !important;
+}
+
+html.dark .swagger-ui input:focus,
+html.dark .swagger-ui textarea:focus,
+html.dark .swagger-ui select:focus {
+ border-color: rgba(255, 255, 255, 0.4) !important;
+ box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui input::placeholder,
+html.dark .swagger-ui textarea::placeholder {
+ color: rgba(255, 255, 255, 0.5) !important;
+}
+
+/* Labels and form labels - Dark class selector */
+html.dark .swagger-ui label,
+html.dark .swagger-ui .parameter__extension,
+html.dark .swagger-ui .parameter__deprecated {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+/* Section headers - Dark class selector */
+html.dark .swagger-ui .opblock-section-header h4,
+html.dark .swagger-ui .opblock-section-header label,
+html.dark .swagger-ui h4,
+html.dark .swagger-ui .parameters-container h4,
+html.dark .swagger-ui .responses-inner h4,
+html.dark .swagger-ui .opblock-section-header span,
+html.dark .swagger-ui .opblock-section-header .opblock-section-header-title {
+ color: #ffffff !important;
+}
+
+/* Parameters section specifically - Dark class selector */
+html.dark .swagger-ui .parameters-container > h4,
+html.dark .swagger-ui .parameters-container > label,
+html.dark .swagger-ui .parameters-container > span,
+html.dark .swagger-ui .parameters-container h4 span {
+ color: #ffffff !important;
+}
+
+/* Buttons - Dark class selector */
+html.dark .swagger-ui .btn,
+html.dark .swagger-ui button,
+html.dark .swagger-ui .execute,
+html.dark .swagger-ui .btn-cancel,
+html.dark .swagger-ui .btn-done,
+html.dark .swagger-ui .btn-clear {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(255, 255, 255, 0.3) !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .btn:hover,
+html.dark .swagger-ui button:hover,
+html.dark .swagger-ui .execute:hover {
+ background-color: rgba(255, 255, 255, 0.25) !important;
+ border-color: rgba(255, 255, 255, 0.5) !important;
+}
+
+html.dark .swagger-ui .btn.execute {
+ background-color: #3b82f6 !important;
+ border-color: #2563eb !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .btn.execute:hover {
+ background-color: #2563eb !important;
+}
+
+/* Checkboxes and radio buttons - Dark class selector */
+html.dark .swagger-ui input[type="checkbox"],
+html.dark .swagger-ui input[type="radio"] {
+ accent-color: #3b82f6 !important;
+}
+
+/* Select dropdowns - Dark class selector */
+html.dark .swagger-ui select {
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
+}
+
+/* Parameter sections - Dark class selector */
+html.dark .swagger-ui .parameters-container,
+html.dark .swagger-ui .parameters-col_description {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .parameter__required {
+ color: #f87171 !important;
+}
+
+/* Response sections - Dark class selector */
+html.dark .swagger-ui .response {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .responses-wrapper,
+html.dark .swagger-ui .responses-inner {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+}
+
+/* Unified Response Section Styling - Dark class selector */
+html.dark .swagger-ui .curl,
+html.dark .swagger-ui .curl-command,
+html.dark .swagger-ui .request-snippets,
+html.dark .swagger-ui .request-url,
+html.dark .swagger-ui .response-body,
+html.dark .swagger-ui .response-body-content,
+html.dark .swagger-ui .response-headers,
+html.dark .swagger-ui .highlight-code,
+html.dark .swagger-ui pre.microlight,
+html.dark .swagger-ui pre.example {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border: 1px solid rgba(255, 255, 255, 0.1) !important;
+ border-radius: 6px !important;
+ padding: 12px 16px !important;
+ margin: 12px 0 !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ font-size: 13px !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ line-height: 1.6 !important;
+ overflow-x: auto !important;
+ word-break: break-all !important;
+}
+
+html.dark .swagger-ui .curl code,
+html.dark .swagger-ui .curl-command code,
+html.dark .swagger-ui .request-snippets code,
+html.dark .swagger-ui .request-url code,
+html.dark .swagger-ui .response-body code,
+html.dark .swagger-ui .response-body-content code,
+html.dark .swagger-ui .response-headers code,
+html.dark .swagger-ui .highlight-code code,
+html.dark .swagger-ui pre code {
+ background-color: transparent !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ padding: 0 !important;
+ border: none !important;
+ font-family: inherit !important;
+}
+
+html.dark .swagger-ui .response-body pre,
+html.dark .swagger-ui .response-body-content pre,
+html.dark .swagger-ui .highlight-code pre,
+html.dark .swagger-ui pre.microlight,
+html.dark .swagger-ui pre.example {
+ background-color: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ font-family: inherit !important;
+}
+
+html.dark .swagger-ui .response-headers table {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background-color: transparent !important;
+}
+
+html.dark .swagger-ui .response-headers th,
+html.dark .swagger-ui .response-headers td {
+ padding: 8px 12px !important;
+ text-align: left !important;
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ background-color: transparent !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ font-size: 13px !important;
+}
+
+html.dark .swagger-ui .response-headers th {
+ font-weight: 600 !important;
+ background-color: rgba(255, 255, 255, 0.05) !important;
+}
+
+html.dark .swagger-ui .response-headers tr:last-child th,
+html.dark .swagger-ui .response-headers tr:last-child td {
+ border-bottom: none !important;
+}
+
+/* Unified Syntax Highlighting - Dark mode */
+html.dark .swagger-ui .microlight,
+html.dark .swagger-ui pre.microlight,
+html.dark .swagger-ui pre.example,
+html.dark .swagger-ui .response-body pre,
+html.dark .swagger-ui .response-body-content pre,
+html.dark .swagger-ui .highlight-code pre {
+ color: rgba(255, 255, 255, 0.9) !important;
+ background-color: rgba(0, 0, 0, 0.3) !important;
+}
+
+html.dark .swagger-ui .microlight .string,
+html.dark .swagger-ui .microlight .hljs-string,
+html.dark .swagger-ui .microlight .token.string,
+html.dark .swagger-ui pre .string,
+html.dark .swagger-ui pre .hljs-string,
+html.dark .swagger-ui pre .token.string,
+html.dark .swagger-ui .response-body .string,
+html.dark .swagger-ui .response-body-content .string,
+html.dark .swagger-ui .highlight-code .string,
+html.dark .swagger-ui .highlight-code .hljs-string,
+html.dark .swagger-ui pre.microlight .string,
+html.dark .swagger-ui pre.example .string,
+html.dark .swagger-ui .curl .string,
+html.dark .swagger-ui .request-url .string {
+ color: #059669 !important;
+}
+
+html.dark .swagger-ui .microlight .number,
+html.dark .swagger-ui .microlight .hljs-number,
+html.dark .swagger-ui .microlight .token.number,
+html.dark .swagger-ui pre .number,
+html.dark .swagger-ui pre .hljs-number,
+html.dark .swagger-ui pre .token.number,
+html.dark .swagger-ui .response-body .number,
+html.dark .swagger-ui .response-body-content .number,
+html.dark .swagger-ui pre.microlight .number,
+html.dark .swagger-ui pre.example .number {
+ color: #f87171 !important;
+}
+
+html.dark .swagger-ui .microlight .keyword,
+html.dark .swagger-ui .microlight .hljs-keyword,
+html.dark .swagger-ui .microlight .token.keyword,
+html.dark .swagger-ui pre .keyword,
+html.dark .swagger-ui pre .hljs-keyword {
+ color: #a78bfa !important;
+}
+
+html.dark .swagger-ui .microlight .property,
+html.dark .swagger-ui .microlight .hljs-attr,
+html.dark .swagger-ui .microlight .token.property,
+html.dark .swagger-ui pre .property,
+html.dark .swagger-ui pre .hljs-attr {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-section {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+}
+
+html.dark .swagger-ui .opblock-section-header {
+ background-color: rgba(0, 0, 0, 0.2) !important;
+ border-radius: 12px 12px 0 0 !important;
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+html.dark .swagger-ui .opblock-section-header h4 {
+ margin: 0 !important;
+ font-size: 16px !important;
+ font-weight: 600 !important;
+}
+
+html.dark .swagger-ui .highlight-code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+/* Markdown content in description - Dark class selector */
+html.dark .swagger-ui .info .description h1,
+html.dark .swagger-ui .info .description h2,
+html.dark .swagger-ui .info .description h3,
+html.dark .swagger-ui .info .description h4 {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .info .description h1 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+}
+
+html.dark .swagger-ui .info .description h2 {
+ border-bottom-color: rgba(255, 255, 255, 0.2) !important;
+}
+
+html.dark .swagger-ui .info .description ul,
+html.dark .swagger-ui .info .description ol {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .info .description li {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .info .description li::marker {
+ color: rgba(255, 255, 255, 0.7) !important;
+}
+
+html.dark .swagger-ui .info .description strong {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .info .description code {
+ background-color: rgba(0, 0, 0, 0.4) !important;
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ border-radius: 6px !important;
+}
+
+html.dark .swagger-ui .info .description pre {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .info .description pre code {
+ background-color: transparent !important;
+ border: none !important;
+}
+
+/* Code blocks and syntax highlighting - Dark class selector */
+html.dark .swagger-ui pre,
+html.dark .swagger-ui .example,
+html.dark .swagger-ui .microlight,
+html.dark .swagger-ui pre.example,
+html.dark .swagger-ui pre.microlight {
+ border-radius: 8px !important;
+ overflow: hidden !important;
+}
+
+/* Ensure proper spacing and visibility for all info elements */
+.swagger-ui .info .main {
+ margin: 0 !important;
+ padding: 0 !important;
+}
+
+/* Labels and form labels - Light mode */
+.swagger-ui label,
+.swagger-ui .parameter__name,
+.swagger-ui .parameter__extension,
+.swagger-ui .parameter__in,
+.swagger-ui .parameter__type,
+.swagger-ui .response-col_status,
+.swagger-ui .response-col_description,
+.swagger-ui .prop-name,
+.swagger-ui .prop-type,
+.swagger-ui .prop-format,
+.swagger-ui .prop-enum,
+.swagger-ui .model-title,
+.swagger-ui .model-box-control,
+.swagger-ui .opblock-summary-path,
+.swagger-ui .opblock-summary-description {
+ color: #3b4151 !important;
+}
+
+/* Section headers - Light mode */
+.swagger-ui .opblock-section-header h4,
+.swagger-ui .opblock-section-header label,
+.swagger-ui h4,
+.swagger-ui .parameters-container h4,
+.swagger-ui .responses-inner h4,
+.swagger-ui .opblock-section-header span,
+.swagger-ui .opblock-section-header .opblock-section-header-title {
+ color: #3b4151 !important;
+}
+
+/* Parameters section specifically */
+.swagger-ui .parameters-container > h4,
+.swagger-ui .parameters-container > label,
+.swagger-ui .parameters-container > span {
+ color: #3b4151 !important;
+}
+
+/* Buttons - Light mode */
+.swagger-ui .btn,
+.swagger-ui button,
+.swagger-ui .execute,
+.swagger-ui .btn-cancel,
+.swagger-ui .btn-done,
+.swagger-ui .btn-clear {
+ background-color: rgba(0, 0, 0, 0.1) !important;
+ border-color: rgba(0, 0, 0, 0.2) !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .btn:hover,
+.swagger-ui button:hover,
+.swagger-ui .execute:hover {
+ background-color: rgba(0, 0, 0, 0.15) !important;
+ border-color: rgba(0, 0, 0, 0.3) !important;
+}
+
+.swagger-ui .btn.execute {
+ background-color: #3b82f6 !important;
+ border-color: #2563eb !important;
+ color: #ffffff !important;
+}
+
+.swagger-ui .btn.execute:hover {
+ background-color: #2563eb !important;
+}
+
+/* Checkboxes and radio buttons - Light mode */
+.swagger-ui input[type="checkbox"],
+.swagger-ui input[type="radio"] {
+ accent-color: #3b82f6 !important;
+}
+
+/* Select dropdowns - Light mode */
+.swagger-ui select {
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%233b4151' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
+ background-repeat: no-repeat !important;
+ background-position: right 8px center !important;
+ padding-right: 30px !important;
+}
+
+/* Parameter sections - Light mode */
+.swagger-ui .parameters-container,
+.swagger-ui .parameters-col_description,
+.swagger-ui .parameter__name,
+.swagger-ui .parameter__extension,
+.swagger-ui .parameter__in,
+.swagger-ui .parameter__type,
+.swagger-ui .parameter__deprecated {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .parameter__required {
+ color: #dc2626 !important;
+}
+
+/* Response sections - Light mode */
+.swagger-ui .response,
+.swagger-ui .response-col_status,
+.swagger-ui .response-col_description,
+.swagger-ui .response-col_links {
+ color: #3b4151 !important;
+}
+
+/* Response control media type - Light mode */
+.swagger-ui .response-control-media-type__title,
+.swagger-ui small.response-control-media-type__title {
+ color: #3b4151 !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+}
+
+/* Response description text - Light mode */
+.swagger-ui .response p,
+.swagger-ui .responses-inner p {
+ color: #3b4151 !important;
+}
+
+/* Response "No links" italic text - Light mode */
+.swagger-ui .response i,
+.swagger-ui .responses-inner i {
+ color: rgba(59, 65, 81, 0.7) !important;
+ font-style: italic !important;
+}
+
+/* Unified Response Section Styling - Light mode */
+/* Base container - keep original colors/transparency */
+.swagger-ui .responses-wrapper,
+.swagger-ui .responses-inner {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+}
+
+.swagger-ui .response-col_status {
+ font-weight: 600 !important;
+ font-size: 14px !important;
+}
+
+/* Unified code block style - matches Request URL */
+.swagger-ui .curl,
+.swagger-ui .curl-command,
+.swagger-ui .request-snippets,
+.swagger-ui .request-url,
+.swagger-ui .response-body,
+.swagger-ui .response-body-content,
+.swagger-ui .response-headers,
+.swagger-ui .highlight-code,
+.swagger-ui pre.microlight,
+.swagger-ui pre.example {
+ background-color: #f8f9fa !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+ border-radius: 6px !important;
+ padding: 12px 16px !important;
+ margin: 12px 0 !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ font-size: 13px !important;
+ color: #1a1d29 !important;
+ line-height: 1.6 !important;
+ overflow-x: auto !important;
+ word-break: break-all !important;
+}
+
+/* Code elements within response sections */
+.swagger-ui .curl code,
+.swagger-ui .curl-command code,
+.swagger-ui .request-snippets code,
+.swagger-ui .request-url code,
+.swagger-ui .response-body code,
+.swagger-ui .response-body-content code,
+.swagger-ui .response-headers code,
+.swagger-ui .highlight-code code,
+.swagger-ui pre code,
+.swagger-ui .curl span,
+.swagger-ui .request-url span,
+.swagger-ui .response-body span,
+.swagger-ui .response-body-content span {
+ background-color: transparent !important;
+ color: #1a1d29 !important;
+ padding: 0 !important;
+ border: none !important;
+ font-family: inherit !important;
+}
+
+/* Pre elements */
+.swagger-ui .response-body pre,
+.swagger-ui .response-body-content pre,
+.swagger-ui .highlight-code pre,
+.swagger-ui pre.microlight,
+.swagger-ui pre.example,
+.swagger-ui .curl pre,
+.swagger-ui .request-url pre {
+ background-color: transparent !important;
+ border: none !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ color: #1a1d29 !important;
+ font-family: inherit !important;
+}
+
+/* Force dark text color for all response section content */
+.swagger-ui .curl,
+.swagger-ui .curl-command,
+.swagger-ui .request-snippets,
+.swagger-ui .request-url,
+.swagger-ui .response-body,
+.swagger-ui .response-body-content,
+.swagger-ui .response-headers {
+ color: #1a1d29 !important;
+}
+
+.swagger-ui .curl *,
+.swagger-ui .curl-command *,
+.swagger-ui .request-snippets *,
+.swagger-ui .request-url *,
+.swagger-ui .response-body *,
+.swagger-ui .response-body-content *,
+.swagger-ui .response-headers * {
+ color: inherit !important;
+}
+
+/* Response headers table */
+.swagger-ui .response-headers table {
+ width: 100% !important;
+ border-collapse: collapse !important;
+ background-color: transparent !important;
+}
+
+.swagger-ui .response-headers th,
+.swagger-ui .response-headers td {
+ padding: 8px 12px !important;
+ text-align: left !important;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
+ color: #1a1d29 !important;
+ background-color: transparent !important;
+ font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+ font-size: 13px !important;
+}
+
+.swagger-ui .response-headers th {
+ font-weight: 600 !important;
+ background-color: rgba(0, 0, 0, 0.03) !important;
+}
+
+.swagger-ui .response-headers tr:last-child th,
+.swagger-ui .response-headers tr:last-child td {
+ border-bottom: none !important;
+}
+
+.swagger-ui .opblock-section {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+}
+
+.swagger-ui .opblock-section-header {
+ border-radius: 12px 12px 0 0 !important;
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+.swagger-ui .opblock-section-header h4 {
+ margin: 0 !important;
+ font-size: 16px !important;
+ font-weight: 600 !important;
+}
+
+.swagger-ui .highlight-code {
+ background-color: #f8f9fa !important;
+ border: 1px solid rgba(0, 0, 0, 0.1) !important;
+ border-radius: 6px !important;
+ padding: 12px 16px !important;
+}
+
+/* Unified Syntax Highlighting - Light mode */
+.swagger-ui .microlight,
+.swagger-ui pre.microlight,
+.swagger-ui pre.example,
+.swagger-ui .response-body pre,
+.swagger-ui .response-body-content pre,
+.swagger-ui .highlight-code pre,
+.swagger-ui .curl pre,
+.swagger-ui .request-url pre,
+.swagger-ui .response-headers pre {
+ color: #1a1d29 !important;
+ background-color: #f8f9fa !important;
+}
+
+/* Ensure all text in response sections is dark and readable */
+.swagger-ui .microlight *,
+.swagger-ui pre.microlight *,
+.swagger-ui pre.example *,
+.swagger-ui .response-body *,
+.swagger-ui .response-body-content *,
+.swagger-ui .highlight-code *,
+.swagger-ui .curl *,
+.swagger-ui .request-url *,
+.swagger-ui .response-headers * {
+ color: inherit !important;
+}
+
+/* String values - dark green for readability */
+.swagger-ui .microlight .string,
+.swagger-ui .microlight .hljs-string,
+.swagger-ui .microlight .token.string,
+.swagger-ui pre .string,
+.swagger-ui pre .hljs-string,
+.swagger-ui pre .token.string,
+.swagger-ui .response-body .string,
+.swagger-ui .response-body-content .string,
+.swagger-ui .highlight-code .string,
+.swagger-ui .highlight-code .hljs-string,
+.swagger-ui pre.microlight .string,
+.swagger-ui pre.example .string,
+.swagger-ui .curl .string,
+.swagger-ui .request-url .string,
+.swagger-ui .microlight span[style*="color"],
+.swagger-ui pre span[style*="color"] {
+ color: #059669 !important;
+}
+
+/* Number values - red */
+.swagger-ui .microlight .number,
+.swagger-ui .microlight .hljs-number,
+.swagger-ui .microlight .token.number,
+.swagger-ui pre .number,
+.swagger-ui pre .hljs-number,
+.swagger-ui pre .token.number,
+.swagger-ui .response-body .number,
+.swagger-ui .response-body-content .number,
+.swagger-ui pre.microlight .number,
+.swagger-ui pre.example .number {
+ color: #dc2626 !important;
+}
+
+/* Keywords - purple */
+.swagger-ui .microlight .keyword,
+.swagger-ui .microlight .hljs-keyword,
+.swagger-ui .microlight .token.keyword,
+.swagger-ui pre .keyword,
+.swagger-ui pre .hljs-keyword {
+ color: #7c3aed !important;
+}
+
+/* Property names - dark */
+.swagger-ui .microlight .property,
+.swagger-ui .microlight .hljs-attr,
+.swagger-ui .microlight .token.property,
+.swagger-ui pre .property,
+.swagger-ui pre .hljs-attr {
+ color: #1a1d29 !important;
+}
+
+/* Override any inline styles that might set green/light colors */
+.swagger-ui .microlight span[style*="green"],
+.swagger-ui pre span[style*="green"],
+.swagger-ui .response-body span[style*="green"],
+.swagger-ui .response-body-content span[style*="green"],
+.swagger-ui .curl span[style*="green"],
+.swagger-ui .request-url span[style*="green"],
+.swagger-ui .highlight-code span[style*="green"] {
+ color: #059669 !important;
+}
+
+/* Override light green inline styles specifically */
+.swagger-ui .microlight span[style*="#90EE90"],
+.swagger-ui .microlight span[style*="#98fb98"],
+.swagger-ui .microlight span[style*="#adff2f"],
+.swagger-ui .microlight span[style*="rgb(144, 238, 144)"],
+.swagger-ui .microlight span[style*="rgb(152, 251, 152)"],
+.swagger-ui pre span[style*="#90EE90"],
+.swagger-ui pre span[style*="#98fb98"],
+.swagger-ui pre span[style*="#adff2f"],
+.swagger-ui pre span[style*="rgb(144, 238, 144)"],
+.swagger-ui pre span[style*="rgb(152, 251, 152)"],
+.swagger-ui .response-body span[style*="#90EE90"],
+.swagger-ui .response-body span[style*="#98fb98"],
+.swagger-ui .response-body span[style*="#adff2f"],
+.swagger-ui .response-body-content span[style*="#90EE90"],
+.swagger-ui .response-body-content span[style*="#98fb98"],
+.swagger-ui .response-body-content span[style*="#adff2f"] {
+ color: #059669 !important;
+}
+
+/* Ensure all response section text is readable */
+.swagger-ui .responses-inner,
+.swagger-ui .responses-inner *,
+.swagger-ui .opblock-section.response,
+.swagger-ui .opblock-section.response * {
+ color: #1a1d29 !important;
+}
+
+.swagger-ui .opblock-section.response .response-body,
+.swagger-ui .opblock-section.response .response-headers,
+.swagger-ui .opblock-section.response .request-url,
+.swagger-ui .opblock-section.response .curl {
+ background-color: #f8f9fa !important;
+ color: #1a1d29 !important;
+}
+
+.swagger-ui .download-url-wrapper {
+ margin-top: 12px !important;
+}
+
+.swagger-ui .download-url-wrapper button {
+ background-color: #3b82f6 !important;
+ border-color: #3b82f6 !important;
+ color: #ffffff !important;
+ border-radius: 6px !important;
+ padding: 8px 16px !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+ transition: all 0.2s ease !important;
+}
+
+.swagger-ui .download-url-wrapper button:hover {
+ background-color: #2563eb !important;
+ border-color: #2563eb !important;
+ transform: translateY(-1px) !important;
+ box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3) !important;
+}
+
+/* Operation block controls and icons - Light mode */
+.swagger-ui .opblock-summary-control {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-summary-control svg,
+.swagger-ui .opblock-summary-control .opblock-summary-control-icon {
+ fill: #3b4151 !important;
+ color: #3b4151 !important;
+}
+
+/* Chevron/wedge icons - Light mode */
+.swagger-ui .opblock-summary-control-btn,
+.swagger-ui .opblock-summary button[class*="control"],
+.swagger-ui .opblock-tag-section button,
+.swagger-ui button[aria-label*="expand"],
+.swagger-ui button[aria-label*="collapse"],
+.swagger-ui .opblock-summary .opblock-summary-control {
+ background-color: transparent !important;
+ border: none !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-summary-control-btn svg,
+.swagger-ui .opblock-summary button[class*="control"] svg,
+.swagger-ui .opblock-tag-section button svg,
+.swagger-ui button[aria-label*="expand"] svg,
+.swagger-ui button[aria-label*="collapse"] svg,
+.swagger-ui .opblock-summary .opblock-summary-control svg {
+ fill: #3b4151 !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-summary-control-btn:hover,
+.swagger-ui .opblock-summary button[class*="control"]:hover,
+.swagger-ui .opblock-tag-section button:hover,
+.swagger-ui button[aria-label*="expand"]:hover,
+.swagger-ui button[aria-label*="collapse"]:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+}
+
+/* Tag section buttons (like V1 header) - Light mode */
+.swagger-ui .opblock-tag-section button,
+.swagger-ui .opblock-tag button {
+ background-color: transparent !important;
+ border: none !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-tag-section button svg,
+.swagger-ui .opblock-tag button svg {
+ fill: #3b4151 !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-tag-section button:hover,
+.swagger-ui .opblock-tag button:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+}
+
+/* Lock/unlock icons on endpoints - Light mode */
+.swagger-ui .opblock-summary .view-line-link,
+.swagger-ui .opblock-summary .authorization__btn,
+.swagger-ui .opblock-summary .opblock-summary-control-btn,
+.swagger-ui .opblock-summary button[class*="authorization"],
+.swagger-ui .opblock-summary [class*="lock"],
+.swagger-ui .opblock-summary [class*="unlock"] {
+ background-color: transparent !important;
+ border: none !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-summary .view-line-link svg,
+.swagger-ui .opblock-summary .authorization__btn svg,
+.swagger-ui .opblock-summary .opblock-summary-control-btn svg,
+.swagger-ui .opblock-summary button[class*="authorization"] svg,
+.swagger-ui .opblock-summary [class*="lock"] svg,
+.swagger-ui .opblock-summary [class*="unlock"] svg {
+ fill: #3b4151 !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-summary .view-line-link:hover,
+.swagger-ui .opblock-summary .authorization__btn:hover,
+.swagger-ui .opblock-summary .opblock-summary-control-btn:hover,
+.swagger-ui .opblock-summary button[class*="authorization"]:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+}
+
+/* Copy to clipboard button - Light mode */
+.swagger-ui .copy-to-clipboard,
+.swagger-ui .view-line-link.copy-to-clipboard {
+ color: #3b4151 !important;
+ opacity: 0.7 !important;
+ transition: opacity 0.2s ease !important;
+}
+
+.swagger-ui .copy-to-clipboard:hover,
+.swagger-ui .view-line-link.copy-to-clipboard:hover {
+ opacity: 1 !important;
+ color: #1a1d29 !important;
+}
+
+.swagger-ui .copy-to-clipboard svg,
+.swagger-ui .view-line-link.copy-to-clipboard svg {
+ fill: #3b4151 !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .copy-to-clipboard:hover svg,
+.swagger-ui .view-line-link.copy-to-clipboard:hover svg {
+ fill: #1a1d29 !important;
+ color: #1a1d29 !important;
+}
+
+/* Additional Swagger UI elements - Light mode */
+/* Tables - rounded corners */
+.swagger-ui table {
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+.swagger-ui table thead tr td,
+.swagger-ui table thead tr th {
+ color: #3b4151 !important;
+ border-color: rgba(0, 0, 0, 0.1) !important;
+ background-color: rgba(0, 0, 0, 0.03) !important;
+ padding: 16px !important;
+}
+
+.swagger-ui table tbody tr td,
+.swagger-ui table tbody tr th {
+ color: #3b4151 !important;
+ border-color: rgba(0, 0, 0, 0.05) !important;
+ padding: 16px !important;
+}
+
+.swagger-ui table thead tr:first-child td:first-child,
+.swagger-ui table thead tr:first-child th:first-child {
+ border-top-left-radius: 12px !important;
+}
+
+.swagger-ui table thead tr:first-child td:last-child,
+.swagger-ui table thead tr:first-child th:last-child {
+ border-top-right-radius: 12px !important;
+}
+
+
+.swagger-ui table tbody tr:last-child td:first-child,
+.swagger-ui table tbody tr:last-child th:first-child {
+ border-bottom-left-radius: 12px !important;
+}
+
+.swagger-ui table tbody tr:last-child td:last-child,
+.swagger-ui table tbody tr:last-child th:last-child {
+ border-bottom-right-radius: 12px !important;
+}
+
+.swagger-ui .parameter__name,
+.swagger-ui .parameter__type,
+.swagger-ui .parameter__in,
+.swagger-ui .response-col_links {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .model-box,
+.swagger-ui .model-title {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .model-box-control {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-summary {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .opblock-description-wrapper p,
+.swagger-ui .opblock-description-wrapper,
+.swagger-ui .opblock-description {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .response-col_description,
+.swagger-ui .response-col_links {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .prop-name,
+.swagger-ui .prop-type {
+ color: #3b4151 !important;
+}
+
+.swagger-ui code {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+ color: #3b4151 !important;
+}
+
+.swagger-ui .highlight-code {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+}
+
+.swagger-ui .microlight {
+ color: #3b4151 !important;
+}
+
+/* Unified Opblock Card Styling - Light mode */
+/* Base opblock card container - keep original colors/transparency */
+.swagger-ui .opblock {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Opblock summary (header bar) - keep original colors/transparency */
+.swagger-ui .opblock-summary {
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Opblock body (expanded content) - keep original colors/transparency */
+.swagger-ui .opblock-body {
+ padding: 16px !important;
+}
+
+/* Opblock tag section (like "V1" header) - keep original colors/transparency */
+.swagger-ui .opblock-tag-section {
+ border-radius: 12px !important;
+ margin: 16px 0 !important;
+ padding: 16px !important;
+}
+
+/* Opblock tag (section header like "V1") - keep original colors/transparency */
+.swagger-ui .opblock-tag {
+ border-radius: 12px !important;
+ margin: 16px 0 !important;
+ padding: 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Inner sections - match outer card styling */
+/* Opblock section (Parameters, Responses, etc.) - keep original colors/transparency */
+.swagger-ui .opblock-section {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Parameters container - keep original colors/transparency */
+.swagger-ui .parameters-container {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ padding: 16px !important;
+}
+
+/* Responses inner - keep original colors/transparency */
+.swagger-ui .responses-inner {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+}
+
+/* Opblock section header - keep original colors/transparency */
+.swagger-ui .opblock-section-header {
+ border-radius: 12px 12px 0 0 !important;
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Opblock description wrapper - keep original colors/transparency */
+.swagger-ui .opblock-description-wrapper {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ padding: 16px !important;
+}
+
+/* Try it out sections - Light mode */
+.swagger-ui .opblock.opblock-post,
+.swagger-ui .opblock.opblock-get,
+.swagger-ui .opblock.opblock-put,
+.swagger-ui .opblock.opblock-delete,
+.swagger-ui .opblock.opblock-patch {
+ border-color: rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui .opblock.opblock-post .opblock-summary {
+ border-color: rgba(0, 0, 0, 0.1) !important;
+}
+
+.swagger-ui .opblock.opblock-get .opblock-summary {
+ border-color: rgba(0, 0, 0, 0.1) !important;
+}
+
+/* Response examples and code - Light mode */
+.swagger-ui .response-content-type,
+.swagger-ui .response-content-type select {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .highlight-code .microlight {
+ background-color: rgba(0, 0, 0, 0.05) !important;
+}
+
+/* Schema definitions - Light mode */
+.swagger-ui .model-toggle,
+.swagger-ui .model-jump-to-path {
+ color: #3b4151 !important;
+}
+
+.swagger-ui .model-toggle:hover,
+.swagger-ui .model-jump-to-path:hover {
+ color: #1a1d29 !important;
+}
+
+/* Loading and status indicators - Light mode */
+.swagger-ui .loading-container .loading {
+ color: #3b4151 !important;
+}
+
+/* Error messages - Light mode */
+.swagger-ui .errors-wrapper {
+ background-color: rgba(220, 38, 38, 0.1) !important;
+ border-color: rgba(220, 38, 38, 0.3) !important;
+ color: #dc2626 !important;
+}
+
+/* Dark mode - Additional elements */
+@media (prefers-color-scheme: dark) {
+ /* Copy to clipboard button - Dark mode */
+ .swagger-ui .copy-to-clipboard,
+ .swagger-ui .view-line-link.copy-to-clipboard {
+ color: rgba(255, 255, 255, 0.9) !important;
+ opacity: 0.7 !important;
+ transition: opacity 0.2s ease !important;
+ }
+
+ .swagger-ui .copy-to-clipboard:hover,
+ .swagger-ui .view-line-link.copy-to-clipboard:hover {
+ opacity: 1 !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .copy-to-clipboard svg,
+ .swagger-ui .view-line-link.copy-to-clipboard svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .copy-to-clipboard:hover svg,
+ .swagger-ui .view-line-link.copy-to-clipboard:hover svg {
+ fill: #ffffff !important;
+ color: #ffffff !important;
+ }
+
+ /* Tables - rounded corners */
+ .swagger-ui table {
+ border-radius: 12px !important;
+ overflow: hidden !important;
+ }
+
+ .swagger-ui table thead tr td,
+ .swagger-ui table thead tr th {
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ padding: 16px !important;
+ }
+
+ .swagger-ui table thead tr:first-child td:first-child,
+ .swagger-ui table thead tr:first-child th:first-child {
+ border-top-left-radius: 12px !important;
+ }
+
+ .swagger-ui table thead tr:first-child td:last-child,
+ .swagger-ui table thead tr:first-child th:last-child {
+ border-top-right-radius: 12px !important;
+ }
+
+ .swagger-ui table tbody tr td,
+ .swagger-ui table tbody tr th {
+ color: rgba(255, 255, 255, 0.9) !important;
+ border-color: rgba(255, 255, 255, 0.05) !important;
+ padding: 16px !important;
+ }
+
+ .swagger-ui table tbody tr:last-child td:first-child,
+ .swagger-ui table tbody tr:last-child th:first-child {
+ border-bottom-left-radius: 12px !important;
+ }
+
+ .swagger-ui table tbody tr:last-child td:last-child,
+ .swagger-ui table tbody tr:last-child th:last-child {
+ border-bottom-right-radius: 12px !important;
+ }
+
+ .swagger-ui .parameter__name,
+ .swagger-ui .parameter__type,
+ .swagger-ui .parameter__in,
+ .swagger-ui .response-col_links {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .model-box,
+ .swagger-ui .model-title {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .model-box-control {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .opblock-summary {
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .opblock-description-wrapper p,
+ .swagger-ui .opblock-description-wrapper,
+ .swagger-ui .opblock-description {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .response-col_description,
+ .swagger-ui .response-col_links {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ /* Response control media type - Dark mode */
+ .swagger-ui .response-control-media-type__title,
+ .swagger-ui small.response-control-media-type__title {
+ color: rgba(255, 255, 255, 0.9) !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+ }
+
+ /* Response description text - Dark mode */
+ .swagger-ui .response p,
+ .swagger-ui .responses-inner p {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ /* Response "No links" italic text - Dark mode */
+ .swagger-ui .response i,
+ .swagger-ui .responses-inner i {
+ color: rgba(255, 255, 255, 0.6) !important;
+ font-style: italic !important;
+ }
+
+ .swagger-ui .prop-name,
+ .swagger-ui .prop-type {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .parameter__required {
+ color: #f87171 !important;
+ }
+
+ .swagger-ui code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: #ffffff !important;
+ }
+
+ .swagger-ui .highlight-code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ }
+
+ .swagger-ui .microlight {
+ color: #ffffff !important;
+ }
+
+ /* Operation block controls and icons - Dark mode */
+ .swagger-ui .opblock-summary-control {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-summary-control svg,
+ .swagger-ui .opblock-summary-control .opblock-summary-control-icon {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ /* Chevron/wedge icons - Dark mode */
+ .swagger-ui .opblock-summary-control-btn,
+ .swagger-ui .opblock-summary button[class*="control"],
+ .swagger-ui .opblock-tag-section button,
+ .swagger-ui button[aria-label*="expand"],
+ .swagger-ui button[aria-label*="collapse"],
+ .swagger-ui .opblock-summary .opblock-summary-control {
+ background-color: transparent !important;
+ border: none !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-summary-control-btn svg,
+ .swagger-ui .opblock-summary button[class*="control"] svg,
+ .swagger-ui .opblock-tag-section button svg,
+ .swagger-ui button[aria-label*="expand"] svg,
+ .swagger-ui button[aria-label*="collapse"] svg,
+ .swagger-ui .opblock-summary .opblock-summary-control svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-summary-control-btn:hover,
+ .swagger-ui .opblock-summary button[class*="control"]:hover,
+ .swagger-ui .opblock-tag-section button:hover,
+ .swagger-ui button[aria-label*="expand"]:hover,
+ .swagger-ui button[aria-label*="collapse"]:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+ }
+
+ /* Tag section buttons (like V1 header) - Dark mode */
+ .swagger-ui .opblock-tag-section button,
+ .swagger-ui .opblock-tag button {
+ background-color: transparent !important;
+ border: none !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-tag-section button svg,
+ .swagger-ui .opblock-tag button svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-tag-section button:hover,
+ .swagger-ui .opblock-tag button:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+ }
+
+ /* Lock/unlock icons on endpoints - Dark mode */
+ .swagger-ui .opblock-summary .view-line-link,
+ .swagger-ui .opblock-summary .authorization__btn,
+ .swagger-ui .opblock-summary .opblock-summary-control-btn,
+ .swagger-ui .opblock-summary button[class*="authorization"],
+ .swagger-ui .opblock-summary [class*="lock"],
+ .swagger-ui .opblock-summary [class*="unlock"] {
+ background-color: transparent !important;
+ border: none !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-summary .view-line-link svg,
+ .swagger-ui .opblock-summary .authorization__btn svg,
+ .swagger-ui .opblock-summary .opblock-summary-control-btn svg,
+ .swagger-ui .opblock-summary button[class*="authorization"] svg,
+ .swagger-ui .opblock-summary [class*="lock"] svg,
+ .swagger-ui .opblock-summary [class*="unlock"] svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .opblock-summary .view-line-link:hover,
+ .swagger-ui .opblock-summary .authorization__btn:hover,
+ .swagger-ui .opblock-summary .opblock-summary-control-btn:hover,
+ .swagger-ui .opblock-summary button[class*="authorization"]:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+ }
+
+ /* Unified Opblock Card Styling - Dark mode */
+ /* Base opblock card container - keep original colors/transparency */
+ .swagger-ui .opblock {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+ }
+
+ /* Opblock summary (header bar) - keep original colors/transparency */
+ .swagger-ui .opblock-summary {
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+ }
+
+ /* Opblock body (expanded content) - keep original colors/transparency */
+ .swagger-ui .opblock-body {
+ padding: 16px !important;
+ }
+
+ /* Opblock tag section (like "V1" header) - keep original colors/transparency */
+ .swagger-ui .opblock-tag-section {
+ border-radius: 12px !important;
+ margin: 16px 0 !important;
+ padding: 16px !important;
+ }
+
+ /* Opblock tag (section header like "V1") - keep original colors/transparency */
+ .swagger-ui .opblock-tag {
+ border-radius: 12px !important;
+ margin: 16px 0 !important;
+ padding: 16px !important;
+ transition: all 0.2s ease !important;
+ }
+
+ /* Inner sections - match outer card styling */
+ /* Opblock section (Parameters, Responses, etc.) - keep original colors/transparency */
+ .swagger-ui .opblock-section {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+ }
+
+ /* Parameters container - keep original colors/transparency */
+ .swagger-ui .parameters-container {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ padding: 16px !important;
+ }
+
+ /* Responses inner - keep original colors/transparency */
+ .swagger-ui .responses-inner {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ }
+
+ /* Opblock section header - keep original colors/transparency */
+ .swagger-ui .opblock-section-header {
+ border-radius: 12px 12px 0 0 !important;
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+ }
+
+ /* Opblock description wrapper - keep original colors/transparency */
+ .swagger-ui .opblock-description-wrapper {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ padding: 16px !important;
+ }
+
+ /* Try it out sections - Dark mode */
+ .swagger-ui .opblock.opblock-post,
+ .swagger-ui .opblock.opblock-get,
+ .swagger-ui .opblock.opblock-put,
+ .swagger-ui .opblock.opblock-delete,
+ .swagger-ui .opblock.opblock-patch {
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .opblock.opblock-post .opblock-summary {
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ .swagger-ui .opblock.opblock-get .opblock-summary {
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ }
+
+ /* Response examples and code - Dark mode */
+ .swagger-ui .response-content-type,
+ .swagger-ui .response-content-type select {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .highlight-code .microlight {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ }
+
+ /* Schema definitions - Dark mode */
+ .swagger-ui .model-toggle,
+ .swagger-ui .model-jump-to-path {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ .swagger-ui .model-toggle:hover,
+ .swagger-ui .model-jump-to-path:hover {
+ color: #ffffff !important;
+ }
+
+ /* Loading and status indicators - Dark mode */
+ .swagger-ui .loading-container .loading {
+ color: rgba(255, 255, 255, 0.9) !important;
+ }
+
+ /* Error messages - Dark mode */
+ .swagger-ui .errors-wrapper {
+ background-color: rgba(220, 38, 38, 0.2) !important;
+ border-color: rgba(220, 38, 38, 0.4) !important;
+ color: #f87171 !important;
+ }
+}
+
+/* Dark class selector - Additional elements */
+/* Copy to clipboard button - Dark mode */
+html.dark .swagger-ui .copy-to-clipboard,
+html.dark .swagger-ui .view-line-link.copy-to-clipboard {
+ color: rgba(255, 255, 255, 0.9) !important;
+ opacity: 0.7 !important;
+ transition: opacity 0.2s ease !important;
+}
+
+html.dark .swagger-ui .copy-to-clipboard:hover,
+html.dark .swagger-ui .view-line-link.copy-to-clipboard:hover {
+ opacity: 1 !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .copy-to-clipboard svg,
+html.dark .swagger-ui .view-line-link.copy-to-clipboard svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .copy-to-clipboard:hover svg,
+html.dark .swagger-ui .view-line-link.copy-to-clipboard:hover svg {
+ fill: #ffffff !important;
+ color: #ffffff !important;
+}
+
+/* Tables - rounded corners - Dark mode */
+html.dark .swagger-ui table {
+ border-radius: 12px !important;
+ overflow: hidden !important;
+}
+
+html.dark .swagger-ui table thead tr td,
+html.dark .swagger-ui table thead tr th {
+ color: #ffffff !important;
+ border-color: rgba(255, 255, 255, 0.1) !important;
+ padding: 16px !important;
+}
+
+html.dark .swagger-ui table thead tr:first-child td:first-child,
+html.dark .swagger-ui table thead tr:first-child th:first-child {
+ border-top-left-radius: 12px !important;
+}
+
+html.dark .swagger-ui table thead tr:first-child td:last-child,
+html.dark .swagger-ui table thead tr:first-child th:last-child {
+ border-top-right-radius: 12px !important;
+}
+
+html.dark .swagger-ui table tbody tr td,
+html.dark .swagger-ui table tbody tr th {
+ color: rgba(255, 255, 255, 0.9) !important;
+ border-color: rgba(255, 255, 255, 0.05) !important;
+ padding: 16px !important;
+}
+
+html.dark .swagger-ui table tbody tr:last-child td:first-child,
+html.dark .swagger-ui table tbody tr:last-child th:first-child {
+ border-bottom-left-radius: 12px !important;
+}
+
+html.dark .swagger-ui table tbody tr:last-child td:last-child,
+html.dark .swagger-ui table tbody tr:last-child th:last-child {
+ border-bottom-right-radius: 12px !important;
+}
+
+html.dark .swagger-ui .parameter__name,
+html.dark .swagger-ui .parameter__type,
+html.dark .swagger-ui .parameter__in,
+html.dark .swagger-ui .response-col_links {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .model-box,
+html.dark .swagger-ui .model-title {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .model-box-control {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .opblock-summary {
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .opblock-description-wrapper p,
+html.dark .swagger-ui .opblock-description-wrapper,
+html.dark .swagger-ui .opblock-description {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .response-col_description,
+html.dark .swagger-ui .response-col_links {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+/* Response control media type - Dark class selector */
+html.dark .swagger-ui .response-control-media-type__title,
+html.dark .swagger-ui small.response-control-media-type__title {
+ color: rgba(255, 255, 255, 0.9) !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+}
+
+/* Response description text - Dark class selector */
+html.dark .swagger-ui .response p,
+html.dark .swagger-ui .responses-inner p {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+/* Response "No links" italic text - Dark class selector */
+html.dark .swagger-ui .response i,
+html.dark .swagger-ui .responses-inner i {
+ color: rgba(255, 255, 255, 0.6) !important;
+ font-style: italic !important;
+}
+
+html.dark .swagger-ui .prop-name,
+html.dark .swagger-ui .prop-type {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .parameter__required {
+ color: #f87171 !important;
+}
+
+html.dark .swagger-ui code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+ color: #ffffff !important;
+}
+
+html.dark .swagger-ui .highlight-code {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+}
+
+html.dark .swagger-ui .microlight {
+ color: #ffffff !important;
+}
+
+/* Operation block controls and icons - Dark class selector */
+html.dark .swagger-ui .opblock-summary-control {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-summary-control svg,
+html.dark .swagger-ui .opblock-summary-control .opblock-summary-control-icon {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+/* Chevron/wedge icons - Dark class selector */
+html.dark .swagger-ui .opblock-summary-control-btn,
+html.dark .swagger-ui .opblock-summary button[class*="control"],
+html.dark .swagger-ui .opblock-tag-section button,
+html.dark .swagger-ui button[aria-label*="expand"],
+html.dark .swagger-ui button[aria-label*="collapse"],
+html.dark .swagger-ui .opblock-summary .opblock-summary-control {
+ background-color: transparent !important;
+ border: none !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-summary-control-btn svg,
+html.dark .swagger-ui .opblock-summary button[class*="control"] svg,
+html.dark .swagger-ui .opblock-tag-section button svg,
+html.dark .swagger-ui button[aria-label*="expand"] svg,
+html.dark .swagger-ui button[aria-label*="collapse"] svg,
+html.dark .swagger-ui .opblock-summary .opblock-summary-control svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-summary-control-btn:hover,
+html.dark .swagger-ui .opblock-summary button[class*="control"]:hover,
+html.dark .swagger-ui .opblock-tag-section button:hover,
+html.dark .swagger-ui button[aria-label*="expand"]:hover,
+html.dark .swagger-ui button[aria-label*="collapse"]:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+}
+
+/* Tag section buttons (like V1 header) - Dark class selector */
+html.dark .swagger-ui .opblock-tag-section button,
+html.dark .swagger-ui .opblock-tag button {
+ background-color: transparent !important;
+ border: none !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-tag-section button svg,
+html.dark .swagger-ui .opblock-tag button svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-tag-section button:hover,
+html.dark .swagger-ui .opblock-tag button:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+}
+
+/* Lock/unlock icons on endpoints - Dark class selector */
+html.dark .swagger-ui .opblock-summary .view-line-link,
+html.dark .swagger-ui .opblock-summary .authorization__btn,
+html.dark .swagger-ui .opblock-summary .opblock-summary-control-btn,
+html.dark .swagger-ui .opblock-summary button[class*="authorization"],
+html.dark .swagger-ui .opblock-summary [class*="lock"],
+html.dark .swagger-ui .opblock-summary [class*="unlock"] {
+ background-color: transparent !important;
+ border: none !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-summary .view-line-link svg,
+html.dark .swagger-ui .opblock-summary .authorization__btn svg,
+html.dark .swagger-ui .opblock-summary .opblock-summary-control-btn svg,
+html.dark .swagger-ui .opblock-summary button[class*="authorization"] svg,
+html.dark .swagger-ui .opblock-summary [class*="lock"] svg,
+html.dark .swagger-ui .opblock-summary [class*="unlock"] svg {
+ fill: rgba(255, 255, 255, 0.9) !important;
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .opblock-summary .view-line-link:hover,
+html.dark .swagger-ui .opblock-summary .authorization__btn:hover,
+html.dark .swagger-ui .opblock-summary .opblock-summary-control-btn:hover,
+html.dark .swagger-ui .opblock-summary button[class*="authorization"]:hover {
+ background-color: transparent !important;
+ opacity: 0.7 !important;
+}
+
+/* Unified Opblock Card Styling - Dark class selector */
+/* Base opblock card container - keep original colors/transparency */
+html.dark .swagger-ui .opblock {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Opblock summary (header bar) - keep original colors/transparency */
+html.dark .swagger-ui .opblock-summary {
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Opblock body (expanded content) - keep original colors/transparency */
+html.dark .swagger-ui .opblock-body {
+ padding: 16px !important;
+}
+
+/* Opblock tag section (like "V1" header) - keep original colors/transparency */
+html.dark .swagger-ui .opblock-tag-section {
+ border-radius: 12px !important;
+ margin: 16px 0 !important;
+ padding: 16px !important;
+}
+
+/* Opblock tag (section header like "V1") - keep original colors/transparency */
+html.dark .swagger-ui .opblock-tag {
+ border-radius: 12px !important;
+ margin: 16px 0 !important;
+ padding: 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Inner sections - match outer card styling */
+/* Opblock section (Parameters, Responses, etc.) - keep original colors/transparency */
+html.dark .swagger-ui .opblock-section {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ overflow: hidden !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Parameters container - keep original colors/transparency */
+html.dark .swagger-ui .parameters-container {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ padding: 16px !important;
+}
+
+/* Responses inner - keep original colors/transparency */
+html.dark .swagger-ui .responses-inner {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+}
+
+/* Opblock section header - keep original colors/transparency */
+html.dark .swagger-ui .opblock-section-header {
+ border-radius: 12px 12px 0 0 !important;
+ padding: 12px 16px !important;
+ transition: all 0.2s ease !important;
+}
+
+/* Opblock description wrapper - keep original colors/transparency */
+html.dark .swagger-ui .opblock-description-wrapper {
+ border-radius: 12px !important;
+ margin: 12px 0 !important;
+ padding: 16px !important;
+}
+
+/* Try it out sections - Dark class selector */
+html.dark .swagger-ui .opblock.opblock-post,
+html.dark .swagger-ui .opblock.opblock-get,
+html.dark .swagger-ui .opblock.opblock-put,
+html.dark .swagger-ui .opblock.opblock-delete,
+html.dark .swagger-ui .opblock.opblock-patch {
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .opblock.opblock-post .opblock-summary {
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+html.dark .swagger-ui .opblock.opblock-get .opblock-summary {
+ border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+/* Response examples and code - Dark class selector */
+html.dark .swagger-ui .response-content-type,
+html.dark .swagger-ui .response-content-type select {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .highlight-code .microlight {
+ background-color: rgba(0, 0, 0, 0.3) !important;
+}
+
+/* Schema definitions - Dark class selector */
+html.dark .swagger-ui .model-toggle,
+html.dark .swagger-ui .model-jump-to-path {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+html.dark .swagger-ui .model-toggle:hover,
+html.dark .swagger-ui .model-jump-to-path:hover {
+ color: #ffffff !important;
+}
+
+/* Loading and status indicators - Dark class selector */
+html.dark .swagger-ui .loading-container .loading {
+ color: rgba(255, 255, 255, 0.9) !important;
+}
+
+/* Error messages - Dark class selector */
+html.dark .swagger-ui .errors-wrapper {
+ background-color: rgba(220, 38, 38, 0.2) !important;
+ border-color: rgba(220, 38, 38, 0.4) !important;
+ color: #f87171 !important;
+}
+
+/* Globe background container styling */
+.globe-background-container {
+ opacity: 0.9;
+ transition: opacity 0.3s ease;
+}
+
+.globe-background-container canvas {
+ width: 100% !important;
+ height: 100% !important;
+}
+
+@media (prefers-color-scheme: dark) {
+ .globe-background-container {
+ opacity: 1;
+ }
+}
+
+html.dark .globe-background-container {
+ opacity: 1;
+}
+
+/* Floating token generator - Light mode */
+.floating-token-generator {
+ position: fixed !important;
+ top: 80px !important;
+ right: 24px !important;
+ z-index: 1000 !important;
+ max-width: calc(100vw - 48px) !important;
+}
+
+.floating-token-generator-content {
+ display: flex !important;
+ flex-direction: column-reverse !important;
+ align-items: flex-end !important;
+ gap: 8px !important;
+}
+
+.floating-token-generator-btn {
+ display: flex !important;
+ align-items: center !important;
+ gap: 8px !important;
+ padding: 12px 16px !important;
+ background-color: rgba(59, 130, 246, 0.1) !important;
+ border: 1px solid rgba(59, 130, 246, 0.3) !important;
+ border-radius: 12px !important;
+ color: #3b82f6 !important;
+ font-size: 14px !important;
+ font-weight: 500 !important;
+ cursor: pointer !important;
+ transition: all 0.3s ease !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
+ backdrop-filter: blur(12px) !important;
+ -webkit-backdrop-filter: blur(12px) !important;
+ min-width: 48px !important;
+ width: 48px !important;
+ justify-content: center !important;
+ overflow: hidden !important;
+}
+
+.floating-token-generator-btn:hover {
+ background-color: rgba(59, 130, 246, 0.2) !important;
+ border-color: rgba(59, 130, 246, 0.4) !important;
+ transform: translateY(-2px) !important;
+ box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2) !important;
+ width: auto !important;
+ min-width: auto !important;
+ padding: 12px 20px !important;
+}
+
+.floating-token-generator-btn:hover .floating-token-generator-text {
+ display: inline !important;
+ opacity: 1 !important;
+ margin-left: 0 !important;
+}
+
+.floating-token-generator-btn:disabled {
+ opacity: 0.6 !important;
+ cursor: not-allowed !important;
+ transform: none !important;
+}
+
+.floating-token-generator-icon {
+ width: 18px !important;
+ height: 18px !important;
+ flex-shrink: 0 !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ color: inherit !important;
+}
+
+.floating-token-generator-text {
+ white-space: nowrap !important;
+ display: none !important;
+ opacity: 0 !important;
+ transition: opacity 0.3s ease, margin-left 0.3s ease !important;
+ margin-left: -8px !important;
+}
+
+.floating-token-generator-hint {
+ display: flex !important;
+ align-items: center !important;
+ gap: 8px !important;
+ padding: 10px 16px !important;
+ background-color: rgba(251, 191, 36, 0.1) !important;
+ border: 1px solid rgba(251, 191, 36, 0.3) !important;
+ border-radius: 12px !important;
+ font-size: 13px !important;
+ color: #92400e !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
+ backdrop-filter: blur(12px) !important;
+ -webkit-backdrop-filter: blur(12px) !important;
+ width: auto !important;
+ min-width: auto !important;
+ transition: all 0.3s ease !important;
+}
+
+.floating-hint-icon {
+ width: 16px !important;
+ height: 16px !important;
+ flex-shrink: 0 !important;
+ display: inline-flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ color: inherit !important;
+}
+
+.floating-hint-text {
+ white-space: nowrap !important;
+ display: inline !important;
+ opacity: 1 !important;
+}
+
+/* Token display after successful generation */
+.floating-token-display {
+ margin-top: 0.75rem !important;
+ padding: 12px !important;
+ background-color: rgba(34, 197, 94, 0.1) !important;
+ border: 1px solid rgba(34, 197, 94, 0.3) !important;
+ border-radius: 12px !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
+ backdrop-filter: blur(12px) !important;
+ -webkit-backdrop-filter: blur(12px) !important;
+ min-width: 300px !important;
+ max-width: 400px !important;
+ animation: slideDown 0.3s ease-out !important;
+}
+
+@keyframes slideDown {
+ from {
+ opacity: 0 !important;
+ transform: translateY(-10px) !important;
+ }
+ to {
+ opacity: 1 !important;
+ transform: translateY(0) !important;
+ }
+}
+
+.floating-token-label {
+ font-size: 12px !important;
+ font-weight: 600 !important;
+ color: #166534 !important;
+ margin-bottom: 8px !important;
+ text-transform: uppercase !important;
+ letter-spacing: 0.5px !important;
+}
+
+.floating-token-input-wrapper {
+ display: flex !important;
+ align-items: center !important;
+ gap: 8px !important;
+}
+
+.floating-token-input {
+ flex: 1 !important;
+ padding: 8px 12px !important;
+ background-color: rgba(255, 255, 255, 0.9) !important;
+ border: 1px solid rgba(34, 197, 94, 0.3) !important;
+ border-radius: 8px !important;
+ font-size: 12px !important;
+ font-family: monospace !important;
+ color: #166534 !important;
+ cursor: text !important;
+ transition: all 0.2s ease !important;
+}
+
+.floating-token-input:focus {
+ outline: none !important;
+ border-color: rgba(34, 197, 94, 0.6) !important;
+ background-color: rgba(255, 255, 255, 1) !important;
+ box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.1) !important;
+}
+
+.floating-token-copy-btn {
+ padding: 8px 12px !important;
+ background-color: rgba(34, 197, 94, 0.2) !important;
+ border: 1px solid rgba(34, 197, 94, 0.3) !important;
+ border-radius: 8px !important;
+ color: #166534 !important;
+ cursor: pointer !important;
+ transition: all 0.2s ease !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+ min-width: 36px !important;
+ height: 36px !important;
+ flex-shrink: 0 !important;
+}
+
+.floating-token-copy-btn svg {
+ width: 16px !important;
+ height: 16px !important;
+ color: inherit !important;
+}
+
+.floating-token-copy-btn:hover {
+ background-color: rgba(34, 197, 94, 0.3) !important;
+ border-color: rgba(34, 197, 94, 0.5) !important;
+ transform: scale(1.05) !important;
+}
+
+.floating-token-copy-btn:active {
+ transform: scale(0.95) !important;
+}
+
+/* Floating token generator - Dark mode */
+@media (prefers-color-scheme: dark) {
+ .floating-token-generator-btn {
+ background-color: rgba(59, 130, 246, 0.15) !important;
+ border-color: rgba(59, 130, 246, 0.3) !important;
+ color: #60a5fa !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
+ }
+
+ .floating-token-generator-btn:hover {
+ background-color: rgba(59, 130, 246, 0.25) !important;
+ border-color: rgba(59, 130, 246, 0.4) !important;
+ box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4) !important;
+ }
+
+ .floating-token-generator-hint {
+ background-color: rgba(251, 191, 36, 0.15) !important;
+ border-color: rgba(251, 191, 36, 0.3) !important;
+ color: #fbbf24 !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
+ }
+
+ .floating-token-display {
+ background-color: rgba(34, 197, 94, 0.15) !important;
+ border-color: rgba(34, 197, 94, 0.3) !important;
+ }
+
+ .floating-token-label {
+ color: #4ade80 !important;
+ }
+
+ .floating-token-input {
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ border-color: rgba(34, 197, 94, 0.3) !important;
+ color: #4ade80 !important;
+ }
+
+ .floating-token-input:focus {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(34, 197, 94, 0.5) !important;
+ box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2) !important;
+ }
+
+ .floating-token-copy-btn {
+ background-color: rgba(34, 197, 94, 0.2) !important;
+ border-color: rgba(34, 197, 94, 0.3) !important;
+ color: #4ade80 !important;
+ }
+
+ .floating-token-copy-btn:hover {
+ background-color: rgba(34, 197, 94, 0.3) !important;
+ border-color: rgba(34, 197, 94, 0.5) !important;
+ }
+}
+
+/* Floating token generator - Dark class selector */
+html.dark .floating-token-generator-btn {
+ background-color: rgba(59, 130, 246, 0.15) !important;
+ border-color: rgba(59, 130, 246, 0.3) !important;
+ color: #60a5fa !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
+}
+
+html.dark .floating-token-generator-btn:hover {
+ background-color: rgba(59, 130, 246, 0.25) !important;
+ border-color: rgba(59, 130, 246, 0.4) !important;
+ box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4) !important;
+}
+
+html.dark .floating-token-generator-hint {
+ background-color: rgba(251, 191, 36, 0.15) !important;
+ border-color: rgba(251, 191, 36, 0.3) !important;
+ color: #fbbf24 !important;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
+}
+
+html.dark .floating-token-display {
+ background-color: rgba(34, 197, 94, 0.15) !important;
+ border-color: rgba(34, 197, 94, 0.3) !important;
+}
+
+html.dark .floating-token-label {
+ color: #4ade80 !important;
+}
+
+html.dark .floating-token-input {
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ border-color: rgba(34, 197, 94, 0.3) !important;
+ color: #4ade80 !important;
+}
+
+html.dark .floating-token-input:focus {
+ background-color: rgba(255, 255, 255, 0.15) !important;
+ border-color: rgba(34, 197, 94, 0.5) !important;
+ box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2) !important;
+}
+
+html.dark .floating-token-copy-btn {
+ background-color: rgba(34, 197, 94, 0.2) !important;
+ border-color: rgba(34, 197, 94, 0.3) !important;
+ color: #4ade80 !important;
+}
+
+html.dark .floating-token-copy-btn:hover {
+ background-color: rgba(34, 197, 94, 0.3) !important;
+ border-color: rgba(34, 197, 94, 0.5) !important;
+}
diff --git a/src/utils/swagger.ts b/src/utils/swagger.ts
index 4a47109a..48d0f7f9 100644
--- a/src/utils/swagger.ts
+++ b/src/utils/swagger.ts
@@ -6,8 +6,79 @@ export const swaggerSpec = swaggerJSDoc({
info: {
title: "Multisig API",
version: "1.0.0",
- description:
- "OpenAPI documentation for the Multisig API. This is in alpha stage and under active development. The endpoints are subject to change.",
+ description: `# Multisig API Documentation
+
+OpenAPI documentation for the Multisig API. This is in alpha stage and under active development. The endpoints are subject to change.
+
+## Getting Started
+
+### Authentication
+
+Most endpoints require authentication using a Bearer token (JWT). To authenticate:
+
+#### Option 1: Generate Token with Wallet (Recommended)
+
+1. **Connect your wallet** to the application
+2. Look for the **floating token generator button** in the **upper right corner** of this page
+3. Click the button to **"Generate Token"** - this will:
+ - Request a nonce from the API
+ - Prompt you to sign the nonce with your connected wallet
+ - Exchange the signature for a JWT token
+ - Automatically authorize the token in Swagger UI
+4. If successful, a **copyable token field** will appear above the button showing your generated token
+5. You can **copy the token** using the copy button if needed
+6. The token is automatically applied to all API requests
+
+#### Option 2: Manual Token Entry
+
+1. Click the **"Authorize"** button at the top right of this page (next to the scheme container)
+2. Enter your JWT token in the format: \`Bearer \` or just \`\`
+3. Click **"Authorize"** to apply the token to all requests
+4. Click **"Close"** to close the authorization dialog
+
+#### Token Generation Hints
+
+- If your wallet is **not connected**, you'll see a hint in the upper right corner: "Connect wallet to generate token"
+- Once connected, hover over the floating button to see the "Generate Token" option
+- After generation, the token is displayed in a copyable field for your convenience
+
+Your token will be automatically included in the \`Authorization\` header for all API requests.
+
+### Using the API
+
+1. **Browse Endpoints**: Expand the sections below to see available endpoints organized by tags (V1, Auth, etc.)
+
+2. **View Details**: Click on any endpoint to see:
+ - Request parameters (query, path, or body)
+ - Request/response schemas
+ - Example values
+ - Response codes and descriptions
+
+3. **Try It Out**:
+ - Click the **"Try it out"** button on any endpoint
+ - Fill in the required parameters
+ - Click **"Execute"** to send a real request to the API
+ - View the response including status code, headers, and body
+
+4. **Understand Responses**:
+ - Success responses (200, 201, etc.) show the expected data structure
+ - Error responses (400, 401, 403, 500, etc.) show possible error scenarios
+
+### API Base URL
+
+All endpoints are relative to: \`/api\`
+
+For example, \`/api/v1/nativeScript\` would be accessed at:
+- Production: \`https://your-domain.com/api/v1/nativeScript\`
+- Development: \`http://localhost:3000/api/v1/nativeScript\`
+
+### Rate Limiting
+
+Please be mindful of rate limits when testing endpoints. Excessive requests may result in temporary restrictions.
+
+### Support
+
+For issues or questions about the API, please refer to the main application documentation or contact support.`,
},
components: {
securitySchemes: {
@@ -15,6 +86,21 @@ export const swaggerSpec = swaggerJSDoc({
type: "http",
scheme: "bearer",
bearerFormat: "JWT",
+ description: `# Authentication
+
+This API uses **Bearer Token** authentication (JWT).
+
+## Quick Start
+
+**Option 1: Generate Token (Recommended)**
+1. Connect your wallet
+2. Use the floating token generator in the upper right corner
+3. Click "Generate Token" and sign the nonce
+4. Token is automatically authorized
+
+**Option 2: Manual Entry**
+1. Enter your token below: \`Bearer \` or just \`\`
+2. Click "Authorize"`,
},
},
},
diff --git a/tsconfig.json b/tsconfig.json
index a76a41cf..2c577e1f 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -30,7 +30,6 @@
}
},
"include": [
- ".eslintrc.cjs",
"next-env.d.ts",
"**/*.ts",
"**/*.tsx",