From 7a6585b7d1c9a77698b683b2611f753cdbd5137b Mon Sep 17 00:00:00 2001
From: Arvind Rk <arvindsuna10@gmail.com>
Date: Sat, 4 Oct 2025 16:18:41 -0700
Subject: [PATCH 1/2] updates

---
 src/styles/globals.css | 26 ++++++++++++++++++++------
 tailwind.config.js     |  2 ++
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/src/styles/globals.css b/src/styles/globals.css
index 2f0e7aa..335b17a 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -1,12 +1,26 @@
-@tailwind base;
 @tailwind components;
 @tailwind utilities;
 
-/* Custom base styles for the library */
-@layer base {
-  * {
-    box-sizing: border-box;
-  }
+/* Scoped base styles only for the widget */
+.vapi-widget-wrapper {
+  box-sizing: border-box;
+}
+
+.vapi-widget-wrapper *,
+.vapi-widget-wrapper *::before,
+.vapi-widget-wrapper *::after {
+  box-sizing: border-box;
+}
+
+/* Reset only within widget to prevent inheritance from host page */
+.vapi-widget-wrapper {
+  line-height: 1.5;
+  -webkit-text-size-adjust: 100%;
+  -moz-tab-size: 4;
+  tab-size: 4;
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-feature-settings: normal;
+  font-variation-settings: normal;
 }
 
 /* Hide scrollbar completely */
diff --git a/tailwind.config.js b/tailwind.config.js
index 8729fdf..decaf55 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,5 +1,7 @@
 /** @type {import('tailwindcss').Config} */
 export default {
+  important: '.vapi-widget-wrapper',
+  
   content: [
     './index.html',
     './src/**/*.{js,ts,jsx,tsx}',

From a383b118b1ec14af833b5fc01277d8e9e9d9ff2e Mon Sep 17 00:00:00 2001
From: Arvind Rk <arvindsuna10@gmail.com>
Date: Sat, 4 Oct 2025 16:26:45 -0700
Subject: [PATCH 2/2] updates

---
 src/styles/globals.css | 16 +++++++++++++++-
 tailwind.config.js     |  2 +-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/styles/globals.css b/src/styles/globals.css
index 335b17a..2e82eb7 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -18,7 +18,21 @@
   -webkit-text-size-adjust: 100%;
   -moz-tab-size: 4;
   tab-size: 4;
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-family:
+    ui-sans-serif,
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    Roboto,
+    'Helvetica Neue',
+    Arial,
+    'Noto Sans',
+    sans-serif,
+    'Apple Color Emoji',
+    'Segoe UI Emoji',
+    'Segoe UI Symbol',
+    'Noto Color Emoji';
   font-feature-settings: normal;
   font-variation-settings: normal;
 }
diff --git a/tailwind.config.js b/tailwind.config.js
index decaf55..f3e9f66 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,7 +1,7 @@
 /** @type {import('tailwindcss').Config} */
 export default {
   important: '.vapi-widget-wrapper',
-  
+
   content: [
     './index.html',
     './src/**/*.{js,ts,jsx,tsx}',