{% extends "documentation/base.html" %}

{% block doc_content %}
<h1>Profile Settings</h1>

<p class="lead">
  View your profile information and change your password.
</p>

<h2>Accessing Profile Settings</h2>

<p>To access your profile settings:</p>

<ol>
  <li>Click on your <strong>username</strong> in the top-right corner of the navigation bar</li>
  <li>This will open the User Settings page</li>
</ol>

<figure>
  <img src="{{ url_for('static', filename='images/documentation/user-settings.png') }}"
       alt="User Settings Interface" />
  <figcaption>Figure 1: User Settings page showing profile information and password change form</figcaption>
</figure>

<h2>Profile Information</h2>

<p>Your profile displays the following read-only information:</p>

<ul>
  <li><strong>Username:</strong> Your login username (cannot be changed by users)</li>
  <li><strong>Assigned Roles:</strong> The roles you have been granted by administrators</li>
</ul>

<div class="doc-callout doc-callout-info">
  <strong>💡 Note:</strong><br>
  Only administrators can modify usernames and role assignments via Settings → User Management.
</div>

<h2>Changing Your Password</h2>

<p>You can change your password at any time from the profile settings page.</p>

<h3>Password Change Steps</h3>

<ol>
  <li>Navigate to your profile settings (click your username)</li>
  <li>Locate the <strong>Change Password</strong> section</li>
  <li>Enter your <strong>current password</strong></li>
  <li>Enter your <strong>new password</strong></li>
  <li>Re-enter your <strong>new password</strong> to confirm</li>
  <li>Click <strong>Change Password</strong> or <strong>Save</strong></li>
</ol>

<p>If successful, you will see a confirmation message. Your password is updated immediately.</p>

<div class="doc-callout doc-callout-tip">
  <strong>💡 Password Best Practices:</strong><br>
  Use a strong password with at least 8 characters, including uppercase, lowercase, numbers, and symbols. Avoid common words or easily guessable information.
</div>

<h3>Password Requirements</h3>

<p>BackupChecks password requirements:</p>

<ul>
  <li><strong>Minimum Length:</strong> Typically 6-8 characters (check with your administrator)</li>
  <li><strong>Complexity:</strong> No specific complexity requirements enforced by default</li>
  <li><strong>History:</strong> No password reuse restrictions by default</li>
</ul>

<div class="doc-callout doc-callout-warning">
  <strong>⚠️ Important:</strong><br>
  If you forget your new password, you will need to contact your administrator for a password reset. There is no self-service password recovery.
</div>

<h2>Theme Selection</h2>

<p>While not part of the User Settings page itself, you can change your visual theme at any time using the theme selector in the navigation bar.</p>

<h3>Available Themes</h3>

<table>
  <thead>
    <tr>
      <th>Theme</th>
      <th>Description</th>
      <th>When to Use</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><strong>Light</strong></td>
      <td>Light backgrounds with dark text</td>
      <td>Well-lit environments, daytime use</td>
    </tr>
    <tr>
      <td><strong>Dark</strong></td>
      <td>Dark backgrounds with light text</td>
      <td>Low-light environments, reduce eye strain</td>
    </tr>
    <tr>
      <td><strong>Auto</strong></td>
      <td>Automatically matches your system preference</td>
      <td>Adapts to your OS dark mode setting</td>
    </tr>
  </tbody>
</table>

<h3>Changing Your Theme</h3>

<ol>
  <li>Locate the <strong>theme selector dropdown</strong> in the top-right corner of the navigation bar</li>
  <li>Position: between your username and the logout button (or between role selector and logout if you have multiple roles)</li>
  <li>Click the dropdown to see available themes</li>
  <li>Select <strong>Light</strong>, <strong>Dark</strong>, or <strong>Auto</strong></li>
  <li>The page will reload and apply your selected theme immediately</li>
</ol>

<p>Your theme preference is saved to your profile and will persist across sessions.</p>

<div class="doc-callout doc-callout-tip">
  <strong>💡 Tip:</strong><br>
  The <strong>Auto</strong> theme is recommended if your operating system already has a dark mode schedule. BackupChecks will automatically switch between light and dark themes based on your OS setting.
</div>

<h2>Role Switching</h2>

<p>If you have multiple roles assigned, you can switch between them using the role selector in the navigation bar (not in User Settings).</p>

<p>The role selector appears in the top-right corner between your username and the logout button. Click it to select your active role.</p>

<p>See <a href="{{ url_for('documentation.page', section='users', page='users-and-roles') }}">Users & Roles</a> for detailed information about role permissions and switching.</p>

<h2>Data Privacy</h2>

<h3>What Data is Stored?</h3>

<p>BackupChecks stores the following user information:</p>

<ul>
  <li>Username (required for login)</li>
  <li>Password hash (securely encrypted, never stored in plain text)</li>
  <li>Assigned roles</li>
  <li>Theme preference</li>
  <li>Last active role</li>
</ul>

<h3>Who Can See Your Information?</h3>

<ul>
  <li><strong>You:</strong> Can view your own username and assigned roles</li>
  <li><strong>Administrators:</strong> Can view and edit all user profiles via Settings → User Management</li>
  <li><strong>Other Users:</strong> Cannot view your profile or personal information</li>
</ul>

<h3>Data Retention</h3>

<p>Your profile data is retained as long as your account exists. If your account is deleted by an administrator, all associated profile data is removed.</p>

<h2>Troubleshooting</h2>

<h3>Can't Change Password</h3>

<p><strong>Possible causes:</strong></p>
<ul>
  <li><strong>Current password is incorrect:</strong> Verify you're entering your current password correctly (passwords are case-sensitive)</li>
  <li><strong>New password doesn't meet requirements:</strong> Ensure password meets minimum length (check with your administrator)</li>
  <li><strong>New passwords don't match:</strong> Verify both new password fields contain the exact same password</li>
  <li><strong>Browser autofill issue:</strong> Try typing passwords manually instead of using autofill</li>
</ul>

<div class="doc-callout doc-callout-warning">
  <strong>⚠️ Forgot Your Password?</strong><br>
  If you cannot remember your current password, contact your administrator. They can reset your password via Settings → User Management.
</div>

<h3>Can't Access User Settings</h3>

<p><strong>Possible causes:</strong></p>
<ul>
  <li><strong>Session expired:</strong> Log out and log back in to refresh your session</li>
  <li><strong>Browser issue:</strong> Try a different browser or incognito/private mode</li>
  <li><strong>Username not clickable:</strong> Ensure you're clicking directly on your username text in the top-right corner</li>
</ul>

<h2>Next Steps</h2>

<ul>
  <li><a href="{{ url_for('documentation.page', section='users', page='users-and-roles') }}">Users & Roles</a> - Learn about user roles, permissions, and role switching</li>
  <li><a href="{{ url_for('documentation.page', section='users', page='login-authentication') }}">Login & Authentication</a> - Understand login process and session management</li>
  <li><a href="{{ url_for('documentation.page', section='getting-started', page='first-login') }}">First Login & Dashboard</a> - Navigate the dashboard interface</li>
  <li><a href="{{ url_for('documentation.page', section='settings', page='user-management') }}">User Management Settings</a> - Admin guide for managing user accounts (Admin only)</li>
</ul>

{% endblock %}