<!DOCTYPE html>
<html lang="<%= lang %>">
<head>
    <meta charset="UTF-8">
    <title><%= t.serviceCreate.title %></title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
</head>
<body>

<nav class="navbar navbar-dark bg-dark px-3">
    <span class="navbar-brand">➕ <%= t.serviceCreate.title %></span>
    <a href="/services" class="btn btn-outline-light btn-sm"><%= t.serviceCreate.back %></a>
</nav>

<div class="container mt-4">
<div class="card shadow mx-auto" style="max-width: 600px;">
    <div class="card-body">

        <h4 class="mb-3"><%= t.serviceCreate.newservice %></h4>

        <% if (error) { %>
            <div class="alert alert-danger"><%= error %></div>
        <% } %>

        <form method="POST">

            <div class="mb-2">
                <label class="form-label"><%= t.serviceCreate.namede %></label>
                <input name="name_de" class="form-control" required>
            </div>

            <div class="mb-2">
                <label class="form-label"><%= t.serviceCreate.namees %></label>
                <input name="name_es" class="form-control">
            </div>

            <div class="mb-2">
                <label class="form-label"><%= t.serviceCreate.category %></label>
                <input name="category" class="form-control">
            </div>

            <div class="row">
                <div class="col">
                    <label class="form-label"><%= t.serviceCreate.price %></label>
                    <input name="price" type="number" step="0.01" class="form-control" required>
                </div>
                <div class="col">
                    <label class="form-label"><%= t.serviceCreate.pricec70 %></label>
                    <input name="price_c70" type="number" step="0.01" class="form-control">
                </div>
            </div>

            <button class="btn btn-success w-100 mt-3">
                💾 <%= t.global.save %>
            </button>

        </form>

    </div>
</div>
</div>
</body>
</html>
