fixed trello header

src/components/IntegratedStrategy.tsx

@@ -362,8 +362,8 @@ const IntegratedStrategy = () => {
     <div className="p-2 bg-gray-50">
       <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
         {columns.map((column, index) => (
-          <div key={index} className="bg-white rounded-lg shadow-sm border">
+          <div key={index} className="bg-white rounded-lg">
-            <div className="border-b border-gray-200 bg-[#f6f6fa] p-4 shadow-lg ">
+            <div className="border-b border-gray-200 bg-[#f6f6fa] p-4 rounded-t-lg">
               <div className="flex items-center justify-between">
                 <div className="flex items-center gap-2">
                   <h2 className="text-lg font-bold text-[#2B2D3B]">{column.title}</h2>

src/components/Strategy/RoadmapSidebar.tsx

@@ -24,7 +24,7 @@ const RoadmapSidebar = ({
     ]
 
     return (
-        <div className="lg:w-80 w-[96%] mb-3 lg:mb-0 h-[100%] bg-white border-2 border-gray-200 rounded-lg">
+        <div className="lg:w-80 w-[96%] mb-3 lg:mb-0 h-[100%] bg-white border border-gray-200 rounded-lg">
             {mode ?
                 null
                 :
@@ -50,7 +50,7 @@ const RoadmapSidebar = ({
                     <div key={index} className="border-b border-gray-200 last:border-b-0 ">
                         <button
                             onClick={() => onKeywordSelect(keyword)}
-                            className={`w-full text-left p-3 rounded-lg flex items-center gap-3 transition-colors ${selectedKeyword === keyword ? "bg-blue-50 border border-blue-200" : "hover:bg-gray-50"}`}
+                            className={`w-full text-left p-3 rounded-lg flex items-center gap-3 transition-colors ${selectedKeyword === keyword ? "bg-blue-50 p-[10px]" : "hover:bg-gray-50"}`}
                         >
                             {
                                 selectedKeyword === keyword
@@ -59,7 +59,7 @@ const RoadmapSidebar = ({
                                     <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
   <path d="M9.79395 2.05469C10.8674 2.05469 11.8712 2.25835 12.8096 2.66309C13.7575 3.07196 14.5758 3.62411 15.2695 4.31836C15.9635 5.01287 16.5158 5.83158 16.9258 6.7793C17.3313 7.71663 17.5347 8.71943 17.5332 9.79297V9.87109L16.8818 9.6709C16.8536 7.75376 16.1674 6.10878 14.8232 4.76465C13.4504 3.39187 11.7638 2.70215 9.79395 2.70215C7.82405 2.70217 6.13746 3.39184 4.76465 4.76465C3.39184 6.13746 2.70217 7.82405 2.70215 9.79395C2.70215 11.7638 3.39187 13.4504 4.76465 14.8232C6.10878 16.1674 7.75376 16.8536 9.6709 16.8818L9.87109 17.5332H9.79395C8.71942 17.5332 7.71633 17.3294 6.7793 16.9248C5.83235 16.5159 5.01341 15.964 4.31836 15.2695C3.6235 14.5752 3.07137 13.7569 2.66309 12.8096C2.25888 11.8717 2.05523 10.8681 2.05469 9.79395C2.05417 8.72012 2.258 7.71688 2.66309 6.7793C3.07254 5.8317 3.62445 5.01281 4.31836 4.31836C5.01206 3.62414 5.83046 3.07195 6.77832 2.66309C7.7167 2.25836 8.72049 2.0547 9.79395 2.05469ZM16.3711 12.2891L14.7656 12.8213L13.9961 13.0762L17.7383 16.8184L16.8184 17.7383L13.0762 13.9961L12.8213 14.7656L12.2891 16.3711L10.5391 10.5391L16.3711 12.2891ZM9.79395 5.35059C10.9995 5.35059 12.0153 5.75553 12.8682 6.57129C13.5433 7.21715 13.9662 7.97246 14.1455 8.84863L13.4121 8.63086C13.1826 7.90877 12.7672 7.30069 12.167 6.81934C11.4847 6.27219 10.6861 5.99867 9.79395 5.99805C8.75399 5.99806 7.8517 6.37486 7.11328 7.11328C6.37486 7.8517 5.99806 8.75399 5.99805 9.79395C5.99805 10.6864 6.27148 11.4846 6.81934 12.167C7.30108 12.7671 7.90911 13.1826 8.63086 13.4121L8.84863 14.1455C7.97246 13.9662 7.21715 13.5433 6.57129 12.8682C5.75553 12.0153 5.35059 10.9995 5.35059 9.79395C5.3506 8.55185 5.7791 7.51191 6.64551 6.64551C7.51191 5.7791 8.55185 5.3506 9.79395 5.35059Z" fill="#65677D" stroke="#4C60E5"/>
 </svg>
-                                    <span className="text-md text-blue-600 font-bold">{keyword}</span>
+                                    <span className="text-md text-blue-600 font-semibold">{keyword}</span>
                                     </>
                                     :
                                     <>

src/components/shared/Header.tsx

@@ -158,7 +158,7 @@ const Header = () => {
           <div className="hidden md:flex items-center space-x-4 relative">
             {/* Add Keyword Button */}
 
-              <button className="flex items-center space-x-2 px-4 py-2 bg-blue-600 text-white rounded-lg font-medium shadow-md hover:bg-blue-700 transition-colors duration-200 ">
+              <button className="flex items-center space-x-2 px-4 py-2 bg-blue-600 text-white rounded-xl font-medium shadow-md hover:bg-blue-700 transition-colors duration-200 ">
   <Plus size={18} />
   <span>Add Keywords</span>
 </button>