@extends('layouts.fullwidth')

@section('content')

<style>
    body,
    .authincation {
        background: #f4f7ff !important; /* Same as dashboard */
    }

    .security-signin-link {
        color: rgb(21, 101, 192) !important;
        font-weight: 700;
        text-decoration: none;
    }

    .security-signin-link:hover {
        color: rgb(13, 71, 161) !important;
        text-decoration: underline;
    }

.security-system-name {
    margin-bottom: 2rem;
    text-align: center;
}

.security-system-name h2 {
    color: #102448;
    font-weight: 700;
    margin-bottom: .25rem;
}

.security-system-name p {
    color: #8494b3;
    margin-bottom: 0;
}

</style>

<div class="col-md-6">
    <div class="authincation-content">
        <div class="row no-gutters">
            <div class="col-xl-12">
                <div class="auth-form">
                    <div class="security-system-name">
    <h2>Security SPV</h2>
    <p>OPS & ADMIN</p>
</div>
                    <h4 class="text-center mb-4">Sign up your account</h4>
                    <form action="{{url('index')}}">
                        <div class="form-group">
                            <label class="mb-1"><strong>Username</strong></label>
                            <input type="text" class="form-control" placeholder="username">
                        </div>
                        <div class="form-group">
                            <label class="mb-1"><strong>Email</strong></label>
                            <input type="email" class="form-control" placeholder="hello@example.com">
                        </div>
                        <div class="mb-3 position-relative">
                            <label class="mb-1"><strong>Password</strong></label>
                            <input type="password" id="dz-password" class="form-control" value="123456">
                            <span class="show-pass eye">
                                <i class="fa fa-eye-slash"></i>
                                <i class="fa fa-eye"></i>
                            </span>
                        </div>
                        <div class="text-center mt-4">
                            <button type="submit" class="btn btn-primary btn-block">Sign me up</button>
                        </div>
                    </form>
                    <div class="new-account mt-3">
                        <p>Already have an account? <a class="security-signin-link" href="{{ url('page-login') }}">Sign in</a></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection