refactor: reorganize component imports and enhance index page layout

- Grouped component imports into categories for better organization.
- Updated the layout of the index page to include a gallery structure.
- Added new sections for Button, Badge, Selection Controls, TextField, Select, Numeric Stepper, Avatar, Loading Bar, List Item, Link, Tabs, Breadcrumb, Pagination, Notification, Tooltip, Card, Navbar, Sidebar, Modal, and Icons.
- Improved styling for better visual hierarchy and spacing.
- Implemented a theme toggle feature with persistent state using localStorage.

src/components/pagination/_pagination.scss

@@ -1,6 +1,7 @@
-@use '../../styles/tokens/typography' as *;
+@use "../../styles/tokens/typography" as *;
 
 .pagination {
-    display: flex;
-    gap: var(--nds-spacing-sm);
-}
+  display: flex;
+  align-items: center;
+  gap: var(--nds-spacing-2xs);
+}

src/components/pagination/_paginationNumber.scss

@@ -1,26 +1,30 @@
-@use '../../styles/tokens/typography' as *;
+@use "../../styles/tokens/typography" as *;
 
 .pagination-number {
-  width: 30px;
-  height: 30px;
-  display: flex;
+  min-width: 32px;
+  height: 32px;
+  padding: 0 var(--nds-spacing-2xs);
+  display: inline-flex;
   align-items: center;
   justify-content: center;
-  border-radius: var(--nds-radius-full);
+  border-radius: var(--nds-radius-md);
+  cursor: pointer;
+  @include text-label;
+  color: var(--nds-text);
+  background: transparent;
+  border: 1px solid transparent;
+  transition: all 120ms ease;
+  user-select: none;
   &:hover:not(.pagination-number__disabled):not(.pagination-number__selected) {
-    background-color: var(--nds-secondary);
-    cursor: pointer;
-  }
-  &:active:not(.pagination-number__disabled):not(.pagination-number__selected) {
-    background-color: var(--nds-accent);
-    cursor: pointer;
-  }
-  &__disabled {
-    background-color: var(--nds-disabled);
-    cursor: not-allowed;
+    border-color: var(--nds-border-strong);
+    background-color: var(--nds-surface-hover);
   }
   &__selected {
     background-color: var(--nds-primary);
-    cursor: pointer;
+    color: var(--nds-on-primary);
   }
-}
+  &__disabled {
+    color: var(--nds-disabled);
+    cursor: not-allowed;
+  }
+}