refactor(tender-details): enhance translation page tests and layout

- Updated Cypress tests for the tender translation page to improve visibility checks and streamline assertions.
- Refactored test structure to utilize a dedicated function for fetching the visible title heading.
- Adjusted test cases to ensure accurate language switching and URL handling for tender details.
- Improved layout consistency in the translation page by refining element visibility checks and ensuring proper section rendering.

src/components/FormElements/DatePicker/DatePicker.tsx

@@ -46,16 +46,16 @@ const DatePicker = <T extends FieldValues>({
   minDate,
 }: IProps<T>) => {
   return (
-    <div>
+    <div className="space-y-3">
       <label
         htmlFor={name}
-        className="text-body-sm font-medium capitalize text-dark dark:text-white"
+        className="block text-body-sm font-semibold capitalize tracking-[0.01em] text-dark dark:text-white"
       >
         {label}
         {required && <span className="ml-1 select-none text-error">*</span>}
       </label>
 
-      <div className="mt-3">
+      <div>
         <Controller
           control={control}
           name={name}
@@ -96,18 +96,19 @@ const DatePicker = <T extends FieldValues>({
                     format={`YYYY/MM/DD ${timePicker ? "HH:mm" : ""}`}
                     containerClassName="w-full"
                     inputClass={cn(
-                      "w-full rounded-lg border-[1.5px] border-stroke bg-transparent px-5.5 py-3 pl-12.5 text-dark outline-none transition focus:border-primary disabled:cursor-default disabled:bg-gray-2 dark:border-dark-3 dark:bg-dark-2 dark:text-white dark:focus:border-primary dark:disabled:bg-dark",
-                      error && "!border-red focus:!border-red dark:!border-red",
+                      "w-full rounded-xl border border-stroke/70 bg-white/90 px-5.5 py-3 pl-12.5 text-dark shadow-[0_1px_2px_rgba(16,24,40,0.04),0_8px_20px_rgba(16,24,40,0.04)] outline-none backdrop-blur-[1px] transition-all duration-200 focus:border-primary/70 focus:bg-white focus:shadow-[0_0_0_2px_rgba(59,130,246,0.14),0_10px_24px_rgba(59,130,246,0.08)] disabled:cursor-default disabled:bg-gray-2/70 dark:border-dark-3/80 dark:bg-dark-2/85 dark:text-white dark:focus:border-primary/80 dark:focus:shadow-[0_0_0_2px_rgba(59,130,246,0.2),0_10px_24px_rgba(15,23,42,0.45)] dark:disabled:bg-dark",
+                      error &&
+                        "border-red/80 focus:border-red focus:shadow-[0_0_0_2px_rgba(239,68,68,0.16),0_10px_24px_rgba(239,68,68,0.1)] dark:border-red/80 dark:focus:shadow-[0_0_0_2px_rgba(239,68,68,0.24),0_10px_24px_rgba(127,29,29,0.45)]",
                     )}
                     placeholder={placeholder}
                   />
-                  <span className="absolute left-4.5 top-1/2 -translate-y-1/2">
+                  <span className="pointer-events-none absolute left-4.5 top-1/2 -translate-y-1/2 text-dark-5 transition-colors dark:text-dark-6">
                     <CalendarIcon />
                   </span>
                 </div>
 
                 {error && (
-                  <p className="text-red mt-1.5 text-sm text-error">
+                  <p className="mt-1.5 text-sm font-medium text-error">
                     {error.message as string}
                   </p>
                 )}