add: login page fundamentals

src/app/globals.css

@@ -1,26 +1,64 @@
 @import "tailwindcss";
+@import "../../public/assets/css/fonts.css";
 
-:root {
-  --background: #ffffff;
-  --foreground: #171717;
+@theme {
+  --font-irancell: "Irancell";
+
+  --color-background: #FFFFFF;
+  --color-primary: #C39854;
+  --color-foreground: #333333;
+  --color-disabled: #999999;
+  --radius-normal: 10px;
+  --text-sm2: 13px;
 }
 
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
+* {
+  box-sizing: border-box;
 }
 
-@media (prefers-color-scheme: dark) {
-  :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
+html,
+body {
+  @apply h-full bg-background font-irancell font-normal text-foreground;
+
+  @media (prefers-color-scheme: dark) {
+    /* color-scheme: dark; */
   }
 }
 
-body {
-  background: var(--background);
-  color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
+/* Chrome, Safari, Edge, Opera */
+input[type="number"]::-webkit-outer-spin-button,
+input[type="number"]::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
 }
+
+/* Firefox */
+input[type="number"] {
+  -moz-appearance: textfield;
+}
+
+input[type="password"] {
+  font-family: "fontello";
+  font-style: normal;
+  font-weight: normal;
+  speak: none;
+  color: var(--color-disabled);
+  margin: 10px 0px 10px 0px;
+  font-size: 34px;
+  /* Controls dot size (width & height) */
+  line-height: 8px;
+  /* Ensures vertical alignment */
+
+  /* For safety - reset parent styles, that can break glyph codes*/
+  font-variant: normal;
+  text-transform: none;
+
+  /* Font smoothing. That was taken from TWBS */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  /* Uncomment for 3D effect */
+  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
+
+  /* add spacing to better separate each image */
+  letter-spacing: 2px;
+}