diff --git a/resources/js/Components/NavDropdown.jsx b/resources/js/Components/NavDropdown.jsx
index bfa5f1d..6eb5bbc 100644
--- a/resources/js/Components/NavDropdown.jsx
+++ b/resources/js/Components/NavDropdown.jsx
@@ -13,7 +13,7 @@ export default function NavDropdown({ name, items }) {
                     <ArrowDownIcon/>
                 </div>
             </label>
-            <ul tabIndex={0} className="menu dropdown-content p-2 shadow bg-base-100 rounded-box w-52 mt-4">
+            <ul tabIndex={0} className="menu dropdown-content p-2 shadow bg-base-100 rounded-box w-52 mt-4 text-black">
             {items.map((item, index) => (
                 <li key={index}>
                     <Link href={route(item.route)}>{item.name}</Link>
diff --git a/resources/js/Layouts/AuthenticatedLayout.jsx b/resources/js/Layouts/AuthenticatedLayout.jsx
index 8ead4bc..a7ab933 100644
--- a/resources/js/Layouts/AuthenticatedLayout.jsx
+++ b/resources/js/Layouts/AuthenticatedLayout.jsx
@@ -55,8 +55,8 @@ export default function Authenticated({ auth, children, flash, notify }) {
 
     return (
         <div className="min-h-screen bg-base-200 pb-10">
-            <nav className="bg-base-100 border-b border-base-100">
-                <div className="navbar bg-base-100 rounded-box max-w-7xl m-auto px-6">
+            <nav className="bg-base-100 lg:bg-red-600 border-base-100 lg:border-red-600 lg:text-white">
+                <div className="navbar bg-base-100 lg:bg-red-600 rounded-box max-w-7xl m-auto px-6">
                     <div className="px-2">
                         <a className="text-xl font-bold">Monitor Doc</a>
                     </div>