{% set code='!' %}{% set title='Application Error' %}{% set message='Unexpected error occurred. Please check logs/error.log.' %}
{% extends "base.html" %}
{% block content %}
<style>
.error-wrap{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:2rem}
.error-card{max-width:720px;width:100%;background:#fff;border-radius:24px;padding:2.5rem;box-shadow:0 20px 60px rgba(15,23,42,.12);border:1px solid rgba(148,163,184,.25);text-align:center}
.error-code{font-size:4rem;font-weight:900;letter-spacing:-.06em;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;color:transparent;margin-bottom:.5rem}
.error-title{font-size:1.6rem;font-weight:800;color:#1e293b;margin-bottom:.75rem}
.error-text{color:#64748b;font-size:1rem;margin-bottom:1.5rem}
.error-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}
.error-actions a{padding:.8rem 1.2rem;border-radius:12px;text-decoration:none;font-weight:700}
.btn-main{background:linear-gradient(135deg,#667eea,#764ba2);color:white}
.btn-soft{background:#f1f5f9;color:#334155}
</style>
<div class="error-wrap">
  <div class="error-card">
    <div class="error-code">{{ code }}</div>
    <div class="error-title">{{ title }}</div>
    <p class="error-text">{{ message }}</p>
    <div class="error-actions">
      <a class="btn-main" href="{{ url_for('dashboard') if session.get('user_id') else url_for('login') }}">Go Back Home</a>
      <a class="btn-soft" href="javascript:history.back()">Previous Page</a>
    </div>
  </div>
</div>
{% endblock %}
