Admin mode. Data driven content sections. Bugfixes.

src/app/login/login.component.scss

@@ -0,0 +1,93 @@
+@use '../styles/variables' as *;
+@use '../styles/mixins' as *;
+
+.login-section {
+  @include flex-center;
+  min-height: calc(100vh - 80px);
+  background: $sky-gradient;
+  padding: $spacing-xl;
+}
+
+.login-card {
+  @include card-style;
+  width: 100%;
+  max-width: 400px;
+  padding: $spacing-2xl;
+  text-align: center;
+}
+
+.login-header {
+  margin-bottom: $spacing-lg;
+
+  h1 {
+    font-family: $font-heading;
+    color: $primary-blue;
+    margin: $spacing-sm 0 $spacing-xs;
+    font-size: 1.75rem;
+  }
+
+  p {
+    color: $neutral-medium;
+    font-size: 0.9rem;
+  }
+}
+
+.login-flower {
+  width: 48px;
+  height: 48px;
+  margin-bottom: $spacing-sm;
+}
+
+.login-form {
+  text-align: left;
+}
+
+.form-group {
+  margin-bottom: $spacing-md;
+
+  label {
+    display: block;
+    font-size: 0.875rem;
+    font-weight: 600;
+    color: $neutral-dark;
+    margin-bottom: $spacing-xs;
+  }
+
+  input {
+    width: 100%;
+    padding: $spacing-sm $spacing-md;
+    border: 1px solid $neutral-light;
+    border-radius: $radius-md;
+    font-size: 1rem;
+    transition: border-color $transition-fast;
+    box-sizing: border-box;
+
+    &:focus {
+      outline: none;
+      border-color: $primary-blue;
+      box-shadow: 0 0 0 3px rgba($primary-blue, 0.15);
+    }
+  }
+}
+
+.login-error {
+  background: rgba($danger-red, 0.1);
+  color: $danger-red;
+  padding: $spacing-sm $spacing-md;
+  border-radius: $radius-md;
+  font-size: 0.875rem;
+  margin-bottom: $spacing-md;
+  text-align: center;
+}
+
+.btn-login {
+  @include button-style($primary-blue, $neutral-white, $primary-blue-light);
+  width: 100%;
+  padding: $spacing-sm $spacing-lg;
+  margin-top: $spacing-sm;
+
+  &:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+}