Merge branch 'Sarabia' of https://github.com/jls846/front-censo into Lino

2025-11-04 13:20:26 -06:00
parent 5d0577e5f3 7fe625b42c
commit 018230923d
5 changed files with 286 additions and 83 deletions
@@ -0,0 +1,125 @@
+// =====================================
+// Forgot Password Page Styles (sin variables)
+// =====================================
+
+.forgot-password-page {
+  max-width: 520px;
+  margin: 15rem auto;
+  padding: 2rem;
+  background: #ffffff;
+  border-radius: 1rem;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  color: #222;
+  transition: background 0.3s ease, color 0.3s ease;
+
+  @media (max-width: 768px) {
+    margin: 2rem auto;
+    padding: 1.5rem;
+  }
+
+  h1 {
+    font-size: 1.8rem;
+    font-weight: 600;
+    margin-bottom: 0.75rem;
+    text-align: center;
+    color: #1a73e8;
+  }
+
+  p {
+    font-size: 1rem;
+    line-height: 1.5;
+    margin-bottom: 1.5rem;
+    text-align: center;
+    color: #555;
+  }
+
+  // Formulario principal
+  .forgot-form {
+    display: grid;
+    gap: 1rem;
+
+    label {
+      font-weight: 500;
+      color: #222;
+    }
+
+    input[type="email"] {
+      padding: 0.6rem 0.8rem;
+      border: 1px solid #ccc;
+      border-radius: 8px;
+      font-size: 1rem;
+      transition: border-color 0.2s ease, box-shadow 0.2s ease;
+
+      &:focus {
+        border-color: #1a73e8;
+        box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.15);
+        outline: none;
+      }
+    }
+
+    button[type="submit"] {
+      background-color: #1a73e8;
+      color: #fff;
+      font-weight: 600;
+      padding: 0.75rem 1rem;
+      border-radius: 8px;
+      border: none;
+      cursor: pointer;
+      transition: background-color 0.3s ease, transform 0.2s ease;
+
+      &:hover:not(:disabled) {
+        background-color: #155fc0;
+        transform: translateY(-2px);
+      }
+
+      &:disabled {
+        background-color: #b3d0ff;
+        cursor: not-allowed;
+      }
+    }
+
+    a {
+      display: inline-block;
+      font-size: 0.9rem;
+      color: #1a73e8;
+      text-decoration: none;
+      text-align: center;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+}
+
+// =====================================
+// Modo oscuro (opcional)
+// =====================================
+
+[data-theme="dark"] .forgot-password-page {
+  background: #1e1e1e;
+  color: #eee;
+
+  input[type="email"] {
+    background: #2a2a2a;
+    border-color: #444;
+    color: #f3f3f3;
+
+    &:focus {
+      border-color: #4a90e2;
+      box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.2);
+    }
+  }
+
+  button[type="submit"] {
+    background-color: #4a90e2;
+
+    &:hover:not(:disabled) {
+      background-color: #357ab8;
+    }
+  }
+
+  a {
+    color: #82b1ff;
+  }
+}