Supported Guardrails cards have unreadable text in dark mode

[prdai]

Description

The cards under the Supported Guardrails section have insufficient text contrast when the documentation is viewed in dark mode.

The cards use a near-white background, while their titles and descriptions are also displayed using a very light text color. This makes content such as Content Length Guardrail, Regex Guardrail, JSON Schema Guardrail, and the other guardrail descriptions extremely difficult to read.

Affected page:

https://apim.docs.wso2.com/en/latest/ai-gateway/ai-guardrails/overview/

Actual behavior

The card text blends into the light card background and is barely visible in dark mode.

Expected behavior

The card foreground and background colors should provide clear, readable contrast in both light and dark modes. For example, the cards should use dark text on the existing light background, or use a dark background with light text when dark mode is enabled.

This is also an accessibility and usability issue because users cannot comfortably read the supported guardrail names and descriptions.

Screenshot

Steps to Reproduce

1. Open the following documentation page:

   https://apim.docs.wso2.com/en/latest/ai-gateway/ai-guardrails/overview/

2. Enable dark mode using the documentation theme selector.

3. Scroll down to the Supported Guardrails section.

4. Observe the text inside cards such as:

   • Content Length Guardrail
   • Regex Guardrail
   • JSON Schema Guardrail
   • Sentence Count Guardrail
   • URL Guardrail
   • Word Count Guardrail

5. Notice that the card background is near-white while the title and description text are also very light, making the content difficult to read.

Version

WSO2 API Manager Documentation 4.7.0

Environment Details (with versions)

• Documentation version: WSO2 API Manager 4.7.0
• Page: AI Gateway → AI Guardrails → Overview
• Operating system: Linux
• Browser: Google Chrome 150
• Documentation theme: Dark mode
• Display resolution: 1920 × 1080