<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% if entry %}Edit{% else %}New{% endif %} Regex/CIDR Entry</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background: #f1f1f1;
            padding: 20px;
        }
        .container {
            max-width: 500px;
            margin: 0 auto;
            background: #fff;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0,0,0,0.1);
        }
        h1 {
            text-align: center;
            margin-bottom: 1em;
            color: #333;
        }
        label {
            display: block;
            margin-top: 1em;
            color: #555;
        }
        input[type="text"] {
            width: 100%;
            padding: 8px;
            margin-top: 4px;
            box-sizing: border-box;
            border: 1px solid #ccc;
            border-radius: 4px;
        }
        button {
            margin-top: 1em;
            padding: 10px 20px;
            background: #007bff;
            border: none;
            color: #fff;
            cursor: pointer;
            border-radius: 4px;
            font-size: 1em;
            display: block;
            width: 100%;
        }
        button:hover {
            background: #0056b3;
        }
        .links { 
            text-align: center; 
            margin-top: 10px; 
        }
        .links a {
            color: #007bff;
            text-decoration: none;
        }
        .links a:hover {
            text-decoration: underline;
        }
        .setting-group {
            margin-bottom: 1em;
        }
        .setting-group span {
            font-size: 0.9em;
            color: #888;
        }

        .links { text-align: center; margin-top: 10px; }
        .links a { color: #007bff; text-decoration: none; }
        .links a:hover { text-decoration: underline; }
    </style>
</head>
<body>
<div class="container">
    <h1>{% if entry %}Edit{% else %}New{% endif %} CIDR Entry</h1>
    <form method="POST">
        <label>CIDR Range</label>
        <input type="text" name="cidr_range" value="{{ entry.cidr_range if entry else '' }}" required>
        <label>Gateway IP (option)</label>
        <input type="text" name="gateway_ip" value="{{ entry.gateway_ip if entry else '' }}">
        <label>Gateway Hostname (ex. gw)</label>
        <input type="text" name="gateway_hostname" value="{{ entry.gateway_hostname if entry else '' }}">
        <label>
            <input type="checkbox" name="use_gateway_ip" value="1"
                   {% if entry and entry.use_gateway_ip %}checked{% endif %}>
            Use separate hostname for gateway
        </label>
        <label>Domain Suffix (ex. guest.r.local)</label>
        <input type="text" name="domain_suffix" value="{{ entry.domain_suffix if entry else '' }}">
        <label>Host Prefix (ex. user)</label>
        <input type="text" name="host_prefix" value="{{ entry.host_prefix if entry else '' }}">
        <label>Comment (option)</label>
        <input type="text" name="comment" value="{{ entry.comment if entry else '' }}">
        <button type="submit">Save</button>
    </form>
    <div class="links">
        <a href="{{ url_for('list_regex_hosts') }}">Back to CIDR List</a> |
        <a href="{{ url_for('dashboard') }}">Back to Dashboard</a>
    </div>
</div>
</body>
</html>