> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dodopayments.com/llms.txt
> Use this file to discover all available pages before exploring further.

# चेकआउट सुविधाएँ

> परिवर्तन-ऑप्टिमाइज़्ड, वैश्विक रूप से अनुपालन चेकआउट जिसमें बहु-मुद्रा, बहु-भाषा समर्थन, स्वचालित कर गणना, छूट कोड, ऐड-ऑन, और स्मार्ट पता संग्रह शामिल हैं।

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/cover.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=2dc0a0db8e021e39fb17e84fc12eb5f9" alt="Checkout page" style={{ maxHeight: '500px', width: 'auto' }} width="2844" height="1556" data-path="images/checkout/cover.png" />
</Frame>

<Info>
  Dodo Payments चेकआउट एक कन्वर्ज़न-अनुकूलित, वैश्विक रूप से अनुपालन चेकआउट है जो डिजिटल उत्पादों और SaaS व्यवसायों के लिए डिज़ाइन किया गया है। यह कई मुद्राओं, भाषाओं, करों, छूटों, ऐड-ऑन और बिज़नेस-अनुकूल अनुपालन वर्कफ़्लो का समर्थन करता है।
</Info>

<CardGroup cols={2}>
  <Card title="Checkout Sessions API" icon="code" href="/api-reference/checkout-sessions/create">
    प्रोग्रामेटिक रूप से होस्ट किए गए चेकआउट सेशन बनाएँ।
  </Card>

  <Card title="Preview Checkout" icon="eye" href="/api-reference/checkout-sessions/preview">
    सेशन बनाने से पहले मूल्य निर्धारण और करों की गणना करें।
  </Card>

  <Card title="Payment Methods" icon="credit-card" href="/features/payment-methods">
    समर्थित भुगतान विधियाँ और कॉन्फ़िगरेशन विकल्प।
  </Card>
</CardGroup>

## अनुकूलनशील मुद्रा

अनुकूलनशील मुद्रा ग्राहकों को उनकी पसंदीदा स्थानीय मुद्रा में भुगतान करने की अनुमति देती है, जिससे विश्वास और रूपांतरण दरें बढ़ती हैं।

### यह कैसे काम करता है

1. **सक्रिय करें**: **सेटिंग्स → बिजनेस** से अनुकूली मुद्रा सक्षम करें
2. **चुनें**: ग्राहक सीधे चेकआउट पर मुद्रा बदल सकते हैं
3. **कन्वर्ट करें**: वास्तविक समय के FX दरों का उपयोग करके कीमतों को गतिशील रूप से परिवर्तित किया जाता है
4. **प्रदर्शन करें**: भुगतान से पहले अंतिम देय राशि पारदर्शिता से दिखाई जाती है

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c1.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=c2f9ee4b1748448d4ab7ab23954dcc64" alt="Currency selector on checkout" style={{ maxHeight: '500px', width: '70%' }} width="794" height="858" data-path="images/checkout/c1.png" />
</Frame>

<Card title="Adaptive Currency" icon="money-bill-transfer" href="/features/adaptive-currency">
  समर्थित मुद्राओं, रूपांतरण शुल्कों और रिफंड हैंडलिंग के बारे में अधिक जानें।
</Card>

## बहुभाषी चेकआउट

डोडो पेमेंट्स चेकआउट पृष्ठ पर कई भाषाओं का समर्थन करता है, जिससे ग्राहक अपनी पसंदीदा भाषा में भुगतान पूरा कर सकते हैं।

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c2.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=ecc6eb8db604e37433d8797c51768577" alt="Language selector on checkout" style={{ maxHeight: '500px', width: '70%' }} width="794" height="858" data-path="images/checkout/c2.png" />
</Frame>

### प्रमुख विशेषताएँ

* चेकआउट पर सीधे उपलब्ध भाषा चयनकर्ता
* UI पाठ, लेबल, और सिस्टम संदेश स्थानीयकृत हैं
* पहुंच में सुधार और अंतरराष्ट्रीय रूपांतरण

### समर्थित भाषाएँ

चेकआउट पृष्ठ 21 भाषाओं का समर्थन करता है:

| भाषा        | कोड  |
| ----------- | ---- |
| अरबी        | `ar` |
| कातालान     | `ca` |
| चीनी        | `zh` |
| डच          | `nl` |
| अंग्रेज़ी   | `en` |
| फ्रेंच      | `fr` |
| जर्मन       | `de` |
| हिब्रू      | `he` |
| इंडोनेशियाई | `id` |
| इटालियन     | `it` |
| जापानी      | `ja` |
| कोरियाई     | `ko` |
| मलय         | `ms` |
| पोलिश       | `pl` |
| पोर्तुगीज़  | `pt` |
| रोमानियाई   | `ro` |
| रूसी        | `ru` |
| स्पेनिश     | `es` |
| स्वीडिश     | `sv` |
| थाई         | `th` |
| तुर्की      | `tr` |

<Tip>
  चेकआउट सेशन बनाते समय `force_language` पैरामीटर सेट करके आप चेकआउट पर एक विशिष्ट भाषा लागू कर सकते हैं। विवरण के लिए [Checkout Sessions API](/developer-resources/checkout-session#14-forcing-a-language) देखें।
</Tip>

## स्वचालित कर गणना

कर ग्राहक के बिलिंग स्थान के आधार पर स्वतः गणना किए जाते हैं, जिससे GST, VAT, और बिक्री कर आवश्यकताओं के साथ अनुपालन बिना मैन्युअल सेटअप के सुनिश्चित होता है।

### कर गणना कैसे काम करती है

<Steps>
  <Step title="Location Detection">
    कर नियम ग्राहक के देश (और जहां लागू हो वहां क्षेत्र) के आधार पर लागू किए जाते हैं।
  </Step>

  <Step title="Dynamic Updates">
    कर राशि स्वतः अपडेट होती है जब:

    * देश बदलता है
    * पता अपडेट होता है
  </Step>

  <Step title="Transparent Display">
    भुगतान से पहले अंतिम कर विवरण स्पष्ट रूप से दिखाया जाता है।
  </Step>
</Steps>

<Tip>
  कर गणना पूरी तरह स्वचालित है। मानक डिजिटल सामान और SaaS उत्पादों के लिए किसी मैन्युअल कॉन्फ़िगरेशन की आवश्यकता नहीं है।
</Tip>

## व्यापार कर आईडी समर्थन

पंजीकृत व्यवसायों के लिए, चेकआउट ग्राहकों को उनकी व्यापार कर आईडी (जैसे VAT/GST नंबर) दर्ज करने की अनुमति देता है।

### जब कर आईडी दर्ज की जाती है तो क्या होता है

* कर पात्रता वास्तविक समय में सत्यापित की जाती है
* लागू कर छूट या रिवर्स-चार्ज नियम लागू किए जाते हैं
* कर राशि चेकआउट पर तुरंत अपडेट होती है

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c3.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=76451fed5636a6ef3e5c3ec7f6a96c9f" alt="Business Tax ID entry on checkout" style={{ maxHeight: '500px', width: '70%' }} width="1440" height="1716" data-path="images/checkout/c3.png" />
</Frame>

<Info>
  यह विशेष रूप से B2B SaaS और डिजिटल सेवाओं के लिए उपयोगी है जहाँ व्यावसायिक ग्राहक कर छूट के पात्र हो सकते हैं।
</Info>

## डिस्काउंट कोड

ग्राहक सीधे चेकआउट पृष्ठ पर डैशबोर्ड में बनाए गए डिस्काउंट या प्रोमो कोड लागू कर सकते हैं।

### चेकआउट अनुभव

1. ग्राहक डिस्काउंट कोड दर्ज करता है
2. डिस्काउंट तुरंत सत्यापित होता है
3. अद्यतित मूल्य और बचत स्पष्ट रूप से दिखाई देती है

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c4.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=639dcc94ddd1b41fdd6ff200c2a28e47" alt="Discount code entry on checkout" style={{ maxHeight: '500px', width: '70%' }} width="794" height="858" data-path="images/checkout/c4.png" />
</Frame>

### API एकीकरण

एक या एक से अधिक स्टैक्ड छूट कोड पहले से लागू करें या छूट इनपुट फ़ील्ड को सक्षम करें:

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  discount_codes: ['WELCOME20'], // Pre-apply one or more codes (max 20, applied in order)
  feature_flags: {
    allow_discount_code: true // Show discount input field
  },
  return_url: 'https://yoursite.com/return'
});
```

<Info>
  `discount_codes` एक ऐरे स्वीकार करता है जिसमें 20 तक कोड होते हैं जो क्रम में स्टैक होते हैं। एकल `discount_code` फ़ील्ड पुराना है लेकिन अभी भी काम करता है — मौजूदा एकीकरण को तुरंत बदलने की आवश्यकता नहीं है। स्टैकिंग और अधिक समृद्ध प्रतिक्रिया आकार का उपयोग करने के लिए सुविधाजनक होने पर `discount_codes` पर प्रवास करें।
</Info>

<Card title="Discount Codes" icon="percent" href="/features/discount-codes">
  जानें कि डिस्काउंट कोड कैसे बनाएं और प्रबंधित करें।
</Card>

<Card title="Validate Discount by Code" icon="tag" href="/api-reference/discounts/get-discount-by-code">
  कोड नामों का उपयोग करके छूट को देखें और सत्यापित करें।
</Card>

## स्मार्ट एड्रेस संग्रह

चेकआउट तेज़ समापन के लिए लचीला पता प्रविष्टि का समर्थन करता है।

### उपलब्ध विकल्प

| विकल्प                      | विवरण                              |
| --------------------------- | ---------------------------------- |
| **Google Address Autofill** | ऑटोकंप्लीट के साथ तेज़ चयन         |
| **मैनुअल प्रविष्टि**        | पूर्ण पते के लिए पूर्ण नियंत्रण    |
| **देश चयन**                 | कर और अनुपालन तर्क संचालित करता है |

<Tip>
  पता संग्रह गति, सटीकता, और वैश्विक कवरेज को संतुलित करता है ताकि अधिकतम रूपांतरण सुनिश्चित किया जा सके।
</Tip>

## फ़ोन नंबर संग्रह

यह नियंत्रित करें कि फोन नंबर फ़ील्ड चेकआउट पर दिखाई दे — और क्या यह आवश्यक है — चेकआउट सत्र सुविधा फ़्लैग का उपयोग करके।

| फ्लैग                           | डिफ़ॉल्ट | व्यवहार                                                                         |
| ------------------------------- | -------- | ------------------------------------------------------------------------------- |
| `allow_phone_number_collection` | `true`   | चेकआउट फॉर्म पर फोन नंबर फ़ील्ड दिखाता है                                       |
| `require_phone_number`          | `false`  | फोन नंबर फ़ील्ड को आवश्यक बनाता है (फॉर्म सत्यापन एक गैर-खाली मान लागू करता है) |

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [{ product_id: 'prod_abc', quantity: 1 }],
  feature_flags: {
    allow_phone_number_collection: true,
    require_phone_number: true
  },
  return_url: 'https://yoursite.com/return'
});
```

<Warning>
  `require_phone_number: true` को `allow_phone_number_collection: true` की आवश्यकता है। API उन सत्रों को अस्वीकार कर देता है जहां फ़ोन संग्रह अक्षम है जबकि फ़ोन नंबर आवश्यक है।
</Warning>

<Tip>
  B2B SaaS, विनियमित उद्योगों, या किसी भी प्रक्रिया के लिए `require_phone_number` का उपयोग करें जहां आपको समर्थन, धोखाधड़ी समीक्षा, या अनुपालन के लिए एक सत्यापित संपर्क चैनल की आवश्यकता होती है।
</Tip>

## कस्टम फ़ील्ड

कस्टम फ़ॉर्म फ़ील्ड को परिभाषित करके चेकआउट के दौरान ग्राहकों से अतिरिक्त जानकारी एकत्र करें। यह कंपनी का नाम, टीम का आकार, संदर्भ स्रोत, या किसी अन्य विशिष्ट जानकारी के लिए उपयोगी है।

### उपलब्ध फ़ील्ड प्रकार

| प्रकार     | विवरण                               |
| ---------- | ----------------------------------- |
| `text`     | एकल-पंक्ति पाठ इनपुट                |
| `number`   | संख्यात्मक इनपुट                    |
| `email`    | ईमेल पता सत्यापन के साथ             |
| `url`      | सत्यापन के साथ URL                  |
| `date`     | तिथि चयनकर्ता                       |
| `dropdown` | पूर्वनिर्धारित विकल्पों से चयन करें |
| `boolean`  | हां/नहीं टॉगल                       |

### उदाहरण

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  custom_fields: [
    {
      key: 'company_name',
      label: 'Company Name',
      field_type: 'text',
      required: true
    },
    {
      key: 'team_size',
      label: 'Team Size',
      field_type: 'dropdown',
      required: true,
      options: ['1-10', '11-50', '51-200', '200+']
    }
  ],
  return_url: 'https://yoursite.com/return'
});
```

<Info>
  ग्राहक प्रतिक्रियाओं को स्वचालित रूप से Webhook Payloads (`payment.succeeded`, `subscription.active`) और API प्रतिक्रियाओं में `custom_field_responses` ऐरे के माध्यम से शामिल किया जाता है। आप प्रति चेकआउट सत्र 5 कस्टम फ़ील्ड को परिभाषित कर सकते हैं।
</Info>

<Card title="Custom Fields Guide" icon="input-text" href="/developer-resources/checkout-session#15-collecting-custom-fields">
  कस्टम फ़ील्ड कॉन्फ़िगरेशन और प्रतिक्रियाओं तक पहुँच के बारे में और जानें।
</Card>

## गोपनीयता नीति और शर्तों की स्वीकृति

कानूनी और अनुपालन पारदर्शिता सुनिश्चित करने के लिए:

* [गोपनीयता नीति](https://dodopayments.com/privacy-policy) और [खरीददार की शर्तें](https://dodopayments.com/buyer-terms) लिंक स्पष्ट रूप से चेकआउट पर प्रदर्शित होते हैं
* ग्राहक भुगतान पूरा करने से पहले इनकी स्पष्ट रूप से पुष्टि करते हैं

<Info>
  यह वैश्विक उपभोक्ता संरक्षण और डेटा गोपनीयता आवश्यकताओं को पूरा करने में मदद करता है जिसमें GDPR अनुपालन शामिल है।
</Info>

## संग्रह चेकआउट

उत्पाद संग्रह एक एकीकृत चेकआउट अनुभव को सक्षम करते हैं जहां ग्राहक कई संबंधित उत्पादों (जैसे, स्टार्टर, प्रो, एंटरप्राइज योजनाएं) को एक ही चेकआउट में देख सकते हैं और चुन सकते हैं।

### यह कैसे काम करता है

1. **सभी उत्पाद प्रदर्शित**: ग्राहक संग्रह में सभी सक्रिय उत्पाद देखते हैं
2. **पहला उत्पाद पहले से चयनित**: संग्रह में पहला उत्पाद स्वचालित रूप से चयनित होता है
3. **विकल्पों की तुलना करें**: चुनने से पहले ग्राहक मूल्य निर्धारण और सुविधाओं की तुलना कर सकते हैं
4. **एकल चयन**: उत्पाद का चयन करने के बाद, चेकआउट मानक भुगतान प्रवाह के साथ आगे बढ़ता है

### संग्रह चेकआउट बनाना

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_collection_id: 'pdc_abc123',
  product_cart: [], // Required: pass an empty array for collection checkout
  return_url: 'https://yoursite.com/return'
});
```

<Warning>
  जब `product_collection_id` का उपयोग करते हैं, तो एक खाली `product_cart` ऐरे पास करें। सत्र निर्माण के समय छूट कोड पहले से लागू नहीं किए जा सकते।
</Warning>

<Card title="Product Collections" icon="layer-group" href="/features/product-collections">
  एकीकृत चेकआउट अनुभवों के लिए उत्पाद संग्रह बनाने और प्रबंधित करने का तरीका जानें।
</Card>

## चेकआउट सत्र विन्यास

Checkout Sessions API का उपयोग करके चेकआउट व्यवहार को नियंत्रित करें:

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  customer: {
    email: 'customer@example.com',
    name: 'Jane Doe'
  },
  billing_currency: 'EUR', // Set specific currency
  discount_codes: ['PROMO10'],
  feature_flags: {
    allow_discount_code: true
  },
  return_url: 'https://yoursite.com/return',
  cancel_url: 'https://yoursite.com/pricing', // Optional: where to redirect on cancel
  metadata: {
    order_ref: 'ORD-12345'
  }
});
```

<Info>
  भुगतान के बाद, ग्राहक अपने `return_url` पर पुनः निर्देशित होते हैं जिसमें प्रश्न मापदंड स्वचालित रूप से जोड़े जाते हैं -- जिसमें `payment_id` या `subscription_id`, `status`, `email`, और `license_key` (अगर लागू हो) शामिल हैं। पूर्ण सूची के लिए [चेकआउट सत्र गाइड](/developer-resources/checkout-session#request-body) देखें।
</Info>

<CardGroup cols={2}>
  <Card title="Checkout Sessions API" icon="code" href="/api-reference/checkout-sessions/create">
    चेकआउट सत्रों के लिए पूरा API संदर्भ।
  </Card>

  <Card title="Checkout Integration Guide" icon="book" href="/developer-resources/checkout-session">
    चेकआउट को एकीकृत करने के लिए चरण-दर-चरण मार्गदर्शिका।
  </Card>
</CardGroup>

## Checkout Theme Customization

API के माध्यम से चेकआउट सत्र बनाते समय अपने ब्रांड से मेल खाने के लिए चेकआउट पेज रूप को अनुकूलित करें `customization.theme_config` पैरामीटर का उपयोग करके। हल्के और गहरे मोड के लिए रंग, फ़ॉन्ट, सीमा त्रिज्या और बटन टेक्स्ट को कॉन्फ़िगर करें।

<Frame>
  <img src="https://mintcdn.com/dodopayments/rTHkQICkStFgSdh-/images/checkout/theme-example.png?fit=max&auto=format&n=rTHkQICkStFgSdh-&q=85&s=5277b69d67c90fd87e7c5d9c125fee12" alt="कस्टम थीम जोड़ी गई चेकआउट पेज" style={{ maxHeight: '500px', width: 'auto' }} width="2856" height="1490" data-path="images/checkout/theme-example.png" />
</Frame>

<Card title="Design & Theme Customization" icon="palette" href="/features/design">
  प्री-बिल्ट थीम, टाइपोग्राफी, रंग, और लाइव प्रीव्यू के साथ डैशबोर्ड से दृश्य रूप से थीम को कॉन्फ़िगर करें।
</Card>

<Info>
  यह खंड **सर्वर-साइड API** थीम विन्यास को शामिल करता है `customization.theme_config` का उपयोग करते हुए। यदि आप **चेकआउट SDK** (ओवरले या इनलाइन चेकआउट) का उपयोग कर रहे हैं, तो [ओवरले चेकआउट](/developer-resources/overlay-checkout#theme-customization) या [इनलाइन चेकआउट](/developer-resources/inline-checkout#theme-customization) में थीम अनुकूलन अनुभाग देखें जो camelCase गुणों का उपयोग करते हैं (उदा., `bgPrimary` के बजाय `bg_primary` का)।
</Info>

### थीम कॉन्फ़िगरेशन विकल्प

| प्रॉपर्टी            | विवरण                                                                           |
| -------------------- | ------------------------------------------------------------------------------- |
| `light`              | हल्के मोड के लिए रंग विन्यास                                                    |
| `dark`               | गहरे मोड के लिए रंग विन्यास                                                     |
| `font_primary_url`   | प्राथमिक फ़ॉन्ट के लिए URL                                                      |
| `font_secondary_url` | द्वितीयक फ़ॉन्ट के लिए URL                                                      |
| `font_size`          | फ़ॉन्ट आकार: `xs`, `sm`, `md`, `lg`, `xl`, `2xl`                                |
| `font_weight`        | फ़ॉन्ट वजन: `normal`, `medium`, `bold`, `extraBold`                             |
| `radius`             | UI तत्वों के लिए सीमा त्रिज्या (उदा., `4px`, `0.5rem`, `8px`)                   |
| `pay_button_text`    | भुगतान बटन के लिए कस्टम पाठ (उदा., "खरीदारी पूर्ण करें", "अभी सब्सक्राइब करें") |

### रंग विन्यास (हल्का/गहरा मोड)

प्रत्येक मोड (`light` और `dark`) निम्नलिखित रंग गुणों का समर्थन करता है:

| प्रॉपर्टी                | विवरण                       |
| ------------------------ | --------------------------- |
| `bg_primary`             | बैकग्राउंड प्राथमिक रंग     |
| `bg_secondary`           | बैकग्राउंड द्वितीयक रंग     |
| `text_primary`           | टेक्स्ट प्राथमिक रंग        |
| `text_secondary`         | टेक्स्ट द्वितीयक रंग        |
| `text_placeholder`       | टेक्स्ट प्लेसहोल्डर रंग     |
| `text_error`             | टेक्स्ट त्रुटि रंग          |
| `text_success`           | टेक्स्ट सफलता रंग           |
| `border_primary`         | सीमा प्राथमिक रंग           |
| `border_secondary`       | सीमा द्वितीयक रंग           |
| `button_primary`         | प्राथमिक बटन बैकग्राउंड रंग |
| `button_primary_hover`   | प्राथमिक बटन होवर रंग       |
| `button_secondary`       | द्वितीयक बटन बैकग्राउंड रंग |
| `button_secondary_hover` | द्वितीयक बटन होवर रंग       |
| `button_text_primary`    | प्राथमिक बटन टेक्स्ट रंग    |
| `button_text_secondary`  | द्वितीयक बटन टेक्स्ट रंग    |
| `input_focus_border`     | इनपुट फोकस बॉर्डर रंग       |

<Info>
  सभी रंग फील्ड मानक CSS रंग प्रारूपों को स्वीकार करते हैं:

  * हेक्स: `#fff`, `#ffffff`, `#ffffffff`
  * RGB/RGBA: `rgb(255, 255, 255)`, `rgba(255, 255, 255, 0.5)`
  * HSL/HSLA: `hsl(120, 100%, 50%)`, `hsla(120, 100%, 50%, 0.5)`
  * नामित रंग: `red`, `blue`, `transparent`
</Info>

### उदाहरण

<Info>
  इस खंड में **सर्वर-साइड API** थीम कॉन्फ़िगरेशन को `customization.theme_config` के साथ शामिल किया गया है। यदि आप **Checkout SDK** (ओवरले या इनलाइन चेकआउट) का उपयोग कर रहे हैं, तो [ओवरले चेकआउट](/developer-resources/overlay-checkout#theme-customization) में थीम अनुकूलन अनुभाग देखें जो कि camelCase गुणों का उपयोग करता है (उदाहरण के लिए, `bgPrimary` के बजाय `bg_primary`)।
</Info>

<Tip>
  आपको सभी रंग गुण निर्दिष्ट करने की आवश्यकता नहीं है। सभी असामान्य गुण डिफ़ॉल्ट थीम मानों का उपयोग करेंगे।
</Tip>

| प्रॉपर्टी            | विवरण                                                                       |
| -------------------- | --------------------------------------------------------------------------- |
| `light`              | लाइट मोड के लिए रंग कॉन्फ़िगरेशन                                            |
| `dark`               | डार्क मोड के लिए रंग कॉन्फ़िगरेशन                                           |
| `font_primary_url`   | प्राथमिक फ़ॉन्ट के लिए URL                                                  |
| `font_secondary_url` | सेकेंडरी फ़ॉन्ट के लिए URL                                                  |
| `font_size`          | फ़ॉन्ट आकार: `xs`, `sm`, `md`, `lg`, `xl`, `2xl`                            |
| `font_weight`        | फ़ॉन्ट वजन: `normal`, `medium`, `bold`, `extraBold`                         |
| `radius`             | UI तत्वों के लिए बॉर्डर रेडियस (उदा., `4px`, `0.5rem`, `8px`)               |
| `pay_button_text`    | पे बटन के लिए कस्टम टेक्स्ट (उदा., "खरीद पूरी करें", "अभी सब्सक्राइब करें") |

### रंग कॉन्फ़िगरेशन (लाइट/डार्क मोड)

प्रत्येक मोड (`light` और `dark`) निम्नलिखित रंग प्रॉपर्टियों का समर्थन करता है:

| प्रॉपर्टी                | विवरण                       |
| ------------------------ | --------------------------- |
| `bg_primary`             | बैकग्राउंड प्राथमिक रंग     |
| `bg_secondary`           | बैकग्राउंड सेकेंडरी रंग     |
| `text_primary`           | टेक्स्ट प्राथमिक रंग        |
| `text_secondary`         | टेक्स्ट सेकेंडरी रंग        |
| `text_placeholder`       | टेक्स्ट प्लेसहोल्डर रंग     |
| `text_error`             | टेक्स्ट त्रुटि रंग          |
| `text_success`           | टेक्स्ट सफलता रंग           |
| `border_primary`         | बॉर्डर प्राथमिक रंग         |
| `border_secondary`       | बॉर्डर सेकेंडरी रंग         |
| `button_primary`         | प्राथमिक बटन बैकग्राउंड रंग |
| `button_primary_hover`   | प्राथमिक बटन होवर रंग       |
| `button_secondary`       | सेकेंडरी बटन बैकग्राउंड रंग |
| `button_secondary_hover` | सेकेंडरी बटन होवर रंग       |
| `button_text_primary`    | प्राथमिक बटन टेक्स्ट रंग    |
| `button_text_secondary`  | सेकेंडरी बटन टेक्स्ट रंग    |
| `input_focus_border`     | इनपुट फोकस बॉर्डर रंग       |

<Info>
  सभी रंग फ़ील्ड मानक CSS रंग प्रारूप स्वीकार करते हैं:

  * हेक्स: `#fff`, `#ffffff`, `#ffffffff`
  * RGB/RGBA: `rgb(255, 255, 255)`, `rgba(255, 255, 255, 0.5)`
  * HSL/HSLA: `hsl(120, 100%, 50%)`, `hsla(120, 100%, 50%, 0.5)`
  * नामित रंग: `red`, `blue`, `transparent`
</Info>

### उदाहरण

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  customization: {
    theme_config: {
      // Custom fonts
      font_primary_url: 'https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap',
      font_size: 'md',
      font_weight: 'medium',
      radius: '8px',
      pay_button_text: 'Complete Purchase',
      
      // Light mode colors
      light: {
        bg_primary: '#ffffff',
        bg_secondary: '#f5f5f5',
        text_primary: '#1a1a1a',
        text_secondary: '#666666',
        button_primary: '#0066ff',
        button_primary_hover: '#0052cc',
        button_text_primary: '#ffffff',
        border_primary: '#e0e0e0'
      },
      
      // Dark mode colors
      dark: {
        bg_primary: '#1a1a1a',
        bg_secondary: '#2d2d2d',
        text_primary: '#ffffff',
        text_secondary: '#a0a0a0',
        button_primary: '#3385ff',
        button_primary_hover: '#4d99ff',
        button_text_primary: '#ffffff',
        border_primary: '#404040'
      }
    }
  },
  return_url: 'https://yoursite.com/return'
});
```

<Tip>
  आपको सभी रंग प्रॉपर्टी निर्दिष्ट करने की आवश्यकता नहीं है। कोई भी निर्दिष्ट प्रॉपर्टीज़ डिफॉल्ट थीम मान का उपयोग करेंगी।
</Tip>
