{% extends 'base.html' %}

{% block title %}Financeiro | Locadora{% endblock %}

{% block content %}
<section class="page-header" style="background:var(--surface); border:1px solid var(--border-subtle); border-radius:12px; padding:20px 24px; box-shadow:var(--shadow-xs); display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; align-items:center;">
    <div style="flex:1; min-width:300px;">
        <p class="eyebrow" style="color:var(--primary); font-weight:700; letter-spacing:.06em; display:flex; align-items:center; gap:8px; margin:0;"><span style="width:8px; height:8px; border-radius:50%; background:#059669; display:inline-block; "></span> ADMIN / FINANCEIRO</p>
        <h2 style="font-size:1.5rem; font-weight:700; font-variant-numeric: tabular-nums; letter-spacing:0; color:var(--text-main); margin:8px 0 6px;">Financeiro</h2>
        <p class="page-description" style="max-width:640px; line-height:1.6; color:var(--text-muted);">Visão restrita — valores detalhados são exclusivos para Administradores.</p>
    </div>
    <span style="padding:6px 10px; border-radius:6px; background:#FEF3C7; color:#D97706; font-size:.72rem; font-weight:700;"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" style="display:inline-block; vertical-align:middle;"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg> RESTRITO ADM</span>
</section>

<section class="data-panel" style="padding:28px; text-align:center; border-top:3px solid #D97706;">
    <div style="display:grid; place-items:center; width:48px; height:48px; margin:0 auto 16px; border-radius:50%; background:#FEF3C7; color:#D97706; font-size:1.4rem;"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" style="display:inline-block; vertical-align:middle;"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg></div>
    <h3 style="margin:0 0 8px; color:var(--text-main);">Acesso restrito a Administradores</h3>
    <p style="margin:0 auto; max-width:520px; color:var(--text-muted); font-size:.78rem; line-height:1.6;">Valores de faturamento, receitas e custos são sensíveis e visíveis apenas para <strong>ADMIN</strong>. Seu perfil atual não tem permissão para este módulo — a validação já é feita na view.</p>
    <div style="margin-top:18px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap;">
        <a class="secondary-button" href="{% url 'dashboard:index' %}" style="text-decoration:none;">← Voltar ao dashboard</a>
        <a class="primary-button" href="mailto:admin@locadora.com?subject=Solicitação%20de%20acesso%20Financeiro" style="text-decoration:none;">Solicitar acesso <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" style="display:inline-block; vertical-align:middle;"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></a>
    </div>
    <p style="margin:12px auto 0; max-width:520px; color:var(--text-muted); font-size:.75rem;">Precisa de acesso? Envie solicitação ao administrador. Operação (equipamentos, obras, manutenções) já está liberada para USER.</p>
</section>
{% endblock %}