<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>

    <title>Clocker | Enter PIN</title>
    <link rel="icon"
          href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 128 128%22><text y=%221.2em%22 font-size=%2296%22>⚫️</text></svg>">
            
    <link rel="manifest" href="/site.webmanifest">
    <meta name="theme-color" content="#0ea5e9">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="mobile-web-app-capable" content="yes">

                
<link rel="stylesheet" href="/assets/styles/app-qsLHP9C.css">
<link rel="stylesheet" href="/assets/fontawesome/css/all.min-BHhHGPi.css">
<link rel="stylesheet" href="/assets/@symfony/ux-live-component/live.min-FOtfHpc.css">
<script type="importmap">
{
    "imports": {
        "app": "/assets/app-kBEH_SY.js",
        "/assets/styles/app.css": "data:application/javascript,",
        "/assets/bootstrap.js": "/assets/bootstrap-FHc9U6N.js",
        "/assets/fontawesome/css/all.min.css": "data:application/javascript,",
        "/assets/fontawesome/js/all.min.js": "/assets/fontawesome/js/all.min-QeT36SU.js",
        "sweetalert2": "/assets/vendor/sweetalert2/sweetalert2.index-YnXYxwh.js",
        "/assets/js/util/swal.js": "/assets/js/util/swal-JH8Vn2A.js",
        "/assets/js/util/api.js": "/assets/js/util/api-zOpIMA-.js",
        "alpinejs": "/assets/vendor/alpinejs/alpinejs.index-9bwULTX.js",
        "@alpinejs/collapse": "/assets/vendor/@alpinejs/collapse/collapse.index-n0B0PIk.js",
        "@alpinejs/persist": "/assets/vendor/@alpinejs/persist/persist.index-DCHwAsA.js",
        "@alpinejs/ui": "/assets/vendor/@alpinejs/ui/ui.index-3sQms2a.js",
        "@alpinejs/focus": "/assets/vendor/@alpinejs/focus/focus.index--NCnk3f.js",
        "file-upload-with-preview": "/assets/vendor/file-upload-with-preview/file-upload-with-preview.index-A1bLptX.js",
        "/assets/js/custom.js": "/assets/js/custom-zQpCzWL.js",
        "@symfony/stimulus-bundle": "/assets/@symfony/stimulus-bundle/loader-TdCRoU6.js",
        "/assets/@symfony/stimulus-bundle/controllers.js": "/assets/@symfony/stimulus-bundle/controllers-szGh5Wk.js",
        "@hotwired/stimulus": "/assets/vendor/@hotwired/stimulus/stimulus.index-S4zNcea.js",
        "/assets/@symfony/ux-autocomplete/controller.js": "/assets/@symfony/ux-autocomplete/controller-8FJbQ4e.js",
        "/assets/@symfony/ux-chartjs/controller.js": "/assets/@symfony/ux-chartjs/controller-PAuXbxn.js",
        "/assets/@symfony/ux-live-component/live_controller.js": "/assets/@symfony/ux-live-component/live_controller-75n6hxx.js",
        "/assets/@symfony/ux-live-component/live.min.css": "data:application/javascript,",
        "/assets/controllers/date-range-filter_controller.js": "/assets/controllers/date-range-filter_controller--Cioe6M.js",
        "/assets/controllers/project_work_day_controller.js": "/assets/controllers/project_work_day_controller-B-PAupX.js",
        "/assets/controllers/preferred_payment_method_number_controller.js": "/assets/controllers/preferred_payment_method_number_controller-HK8dsnP.js",
        "/assets/controllers/timesheet_controller.js": "/assets/controllers/timesheet_controller-YDTgQaK.js",
        "/assets/controllers/work_history_dates_controller.js": "/assets/controllers/work_history_dates_controller-aYYQJ72.js",
        "/assets/controllers/hello_controller.js": "/assets/controllers/hello_controller-it0EU__.js",
        "/assets/controllers/preferred_state_tax_rate_controller.js": "/assets/controllers/preferred_state_tax_rate_controller-mXvuuxr.js",
        "/assets/controllers/w4_inputs_dependents_controller.js": "/assets/controllers/w4_inputs_dependents_controller-61Pzw-P.js",
        "/assets/controllers/preferred_paystub_type_controller.js": "/assets/controllers/preferred_paystub_type_controller-sQK9dQ1.js",
        "/assets/controllers/schedule_controller.js": "/assets/controllers/schedule_controller-0ev2Dlf.js",
        "/assets/controllers/w4_inputs_other_controller.js": "/assets/controllers/w4_inputs_other_controller-li11vY0.js",
        "/assets/controllers/work_shift_bulk_lunch_controller.js": "/assets/controllers/work_shift_bulk_lunch_controller-atAzSpW.js",
        "/assets/controllers/timesheet_workshift_controller.js": "/assets/controllers/timesheet_workshift_controller-NC3oa0K.js",
        "/assets/controllers/debounce-form_controller.js": "/assets/controllers/debounce-form_controller-hkA4oGk.js",
        "/assets/controllers/w4_active_controller.js": "/assets/controllers/w4_active_controller-QLfmi6J.js",
        "/assets/controllers/project_controller.js": "/assets/controllers/project_controller-jbk9v8F.js",
        "/assets/controllers/preferred_payment_method_controller.js": "/assets/controllers/preferred_payment_method_controller-zTxVgcQ.js",
        "/assets/controllers/timesheet-commit_controller.js": "/assets/controllers/timesheet-commit_controller-22ofzoO.js",
        "/assets/controllers/clock_controller.js": "/assets/controllers/clock_controller-Q_nD4At.js",
        "/assets/controllers/w4_inputs_filing_controller.js": "/assets/controllers/w4_inputs_filing_controller-5ekccX6.js",
        "/assets/controllers/dashboard-active-users-company-chart_controller.js": "/assets/controllers/dashboard-active-users-company-chart_controller-cOuLzhX.js",
        "/assets/controllers/paystub-company_controller.js": "/assets/controllers/paystub-company_controller-OhognUD.js",
        "/assets/controllers/w4_inputs_multiple_controller.js": "/assets/controllers/w4_inputs_multiple_controller-HE1yM_1.js",
        "/assets/controllers/userdata_controller.js": "/assets/controllers/userdata_controller-_BsTXbq.js",
        "/assets/controllers/paystub_date_controller.js": "/assets/controllers/paystub_date_controller-KUgYMHL.js",
        "/assets/controllers/taxing_state_controller.js": "/assets/controllers/taxing_state_controller-x8Uo-bS.js",
        "/assets/controllers/w4_inputs_deductions_controller.js": "/assets/controllers/w4_inputs_deductions_controller-8JAjOph.js",
        "/assets/controllers/click_guard_controller.js": "/assets/controllers/click_guard_controller-N3B9TBe.js",
        "/assets/controllers/hour_rate_controller.js": "/assets/controllers/hour_rate_controller-BOJ8LLl.js",
        "/assets/controllers/w4_inputs_extra_controller.js": "/assets/controllers/w4_inputs_extra_controller-5GHBMxL.js",
        "tom-select": "/assets/vendor/tom-select/tom-select.index-glUFqPA.js",
        "chart.js": "/assets/vendor/chart.js/chart.js.index-06TNMkm.js",
        "/assets/vendor/tom-select/tom-select.index.js": "/assets/vendor/tom-select/tom-select.index-glUFqPA.js",
        "/assets/controllers/confirm_modal_controller.js": "/assets/controllers/confirm_modal_controller-lGSjTVa.js",
        "@symfony/ux-live-component": "/assets/@symfony/ux-live-component/live_controller-75n6hxx.js",
        "tom-select/dist/js/tom-select.complete.min": "/assets/vendor/tom-select/dist/js/tom-select.complete.min-_CFAMFB.js",
        "air-datepicker": "/assets/vendor/air-datepicker/air-datepicker.index-jhGk2Kd.js",
        "jquery": "/assets/vendor/jquery/jquery.index-F_FRkG8.js",
        "simple-datatables": "/assets/vendor/simple-datatables/simple-datatables.index-tyR9EBO.js",
        "simple-datatables/dist/style.min.css": "data:application/javascript,document.head.appendChild(Object.assign(document.createElement('link'),{rel:'stylesheet',href:'/assets/vendor/simple-datatables/dist/style.min-8kJFb5x.css'}))",
        "byline": "/assets/vendor/byline/byline.index-RMZcAhU.js",
        "underscore.string": "/assets/vendor/underscore.string/underscore.string.index-Gtus3fP.js",
        "through2": "/assets/vendor/through2/through2.index-DhEkM9x.js",
        "readable-stream/transform": "/assets/vendor/readable-stream/transform-EarF0X4.js",
        "xtend": "/assets/vendor/xtend/xtend.index-4YRuTk-.js",
        "core-util-is": "/assets/vendor/core-util-is/core-util-is.index-tX_Fd_I.js",
        "inherits": "/assets/vendor/inherits/inherits.index-dAU0F2h.js",
        "isarray": "/assets/vendor/isarray/isarray.index-Lp5cFcR.js",
        "string_decoder": "/assets/vendor/string_decoder/string_decoder.index-zGE5xCe.js",
        "@symfony/stimulus-bridge": "/assets/vendor/@symfony/stimulus-bridge/stimulus-bridge.index-Pxc8eCp.js",
        "@tailwindcss/forms": "/assets/vendor/@tailwindcss/forms/forms.index-UeCcbW2.js",
        "mini-svg-data-uri": "/assets/vendor/mini-svg-data-uri/mini-svg-data-uri.index-8WQk1DQ.js",
        "tailwindcss/plugin": "/assets/vendor/tailwindcss/plugin-XtYXJ7P.js",
        "tailwindcss/defaultTheme": "/assets/vendor/tailwindcss/defaultTheme-Huhzvw5.js",
        "tailwindcss/colors": "/assets/vendor/tailwindcss/colors-y1aSNv0.js",
        "picocolors": "/assets/vendor/picocolors/picocolors.index-0yzpp44.js",
        "tom-select/dist/css/tom-select.css": "data:application/javascript,document.head.appendChild(Object.assign(document.createElement('link'),{rel:'stylesheet',href:'/assets/vendor/tom-select/dist/css/tom-select-WZKDbwL.css'}))",
        "tom-select/dist/css/tom-select.bootstrap5.css": "data:application/javascript,document.head.appendChild(Object.assign(document.createElement('link'),{rel:'stylesheet',href:'/assets/vendor/tom-select/dist/css/tom-select.bootstrap5-PmntfHB.css'}))",
        "tom-select/dist/css/tom-select.default.css": "data:application/javascript,document.head.appendChild(Object.assign(document.createElement('link'),{rel:'stylesheet',href:'/assets/vendor/tom-select/dist/css/tom-select.default-EUMPfwl.css'}))",
        "file-upload-with-preview/dist/style.min.css": "data:application/javascript,document.head.appendChild(Object.assign(document.createElement('link'),{rel:'stylesheet',href:'/assets/vendor/file-upload-with-preview/dist/style.min-5mWeoP4.css'}))",
        "perfect-scrollbar": "/assets/vendor/perfect-scrollbar/perfect-scrollbar.index-0NNK31d.js",
        "perfect-scrollbar/css/perfect-scrollbar.min.css": "data:application/javascript,document.head.appendChild(Object.assign(document.createElement('link'),{rel:'stylesheet',href:'/assets/vendor/perfect-scrollbar/css/perfect-scrollbar.min-4ug8RRA.css'}))",
        "tom-select/dist/css/tom-select.bootstrap4.css": "data:application/javascript,document.head.appendChild(Object.assign(document.createElement('link'),{rel:'stylesheet',href:'/assets/vendor/tom-select/dist/css/tom-select.bootstrap4--gGdn36.css'}))"
    }
}
</script><script>
if (!HTMLScriptElement.supports || !HTMLScriptElement.supports('importmap')) (function () {
    const script = document.createElement('script');
    script.src = 'https://ga.jspm.io/npm:es-module-shims@1.10.0/dist/es-module-shims.js';
    script.setAttribute('crossorigin', 'anonymous');
    script.setAttribute('integrity', 'sha384-ie1x72Xck445i0j4SlNJ5W5iGeL3Dpa0zD48MZopgWsjNB/lt60SuG1iduZGNnJn');
    document.head.appendChild(script);
})();
</script>
<link rel="modulepreload" href="/assets/app-kBEH_SY.js">
<link rel="modulepreload" href="/assets/bootstrap-FHc9U6N.js">
<link rel="modulepreload" href="/assets/fontawesome/js/all.min-QeT36SU.js">
<link rel="modulepreload" href="/assets/vendor/sweetalert2/sweetalert2.index-YnXYxwh.js">
<link rel="modulepreload" href="/assets/js/util/swal-JH8Vn2A.js">
<link rel="modulepreload" href="/assets/js/util/api-zOpIMA-.js">
<link rel="modulepreload" href="/assets/vendor/alpinejs/alpinejs.index-9bwULTX.js">
<link rel="modulepreload" href="/assets/vendor/@alpinejs/collapse/collapse.index-n0B0PIk.js">
<link rel="modulepreload" href="/assets/vendor/@alpinejs/persist/persist.index-DCHwAsA.js">
<link rel="modulepreload" href="/assets/vendor/@alpinejs/ui/ui.index-3sQms2a.js">
<link rel="modulepreload" href="/assets/vendor/@alpinejs/focus/focus.index--NCnk3f.js">
<link rel="modulepreload" href="/assets/vendor/file-upload-with-preview/file-upload-with-preview.index-A1bLptX.js">
<link rel="modulepreload" href="/assets/js/custom-zQpCzWL.js">
<link rel="modulepreload" href="/assets/@symfony/stimulus-bundle/loader-TdCRoU6.js">
<link rel="modulepreload" href="/assets/@symfony/stimulus-bundle/controllers-szGh5Wk.js">
<link rel="modulepreload" href="/assets/vendor/@hotwired/stimulus/stimulus.index-S4zNcea.js">
<link rel="modulepreload" href="/assets/@symfony/ux-autocomplete/controller-8FJbQ4e.js">
<link rel="modulepreload" href="/assets/@symfony/ux-chartjs/controller-PAuXbxn.js">
<link rel="modulepreload" href="/assets/@symfony/ux-live-component/live_controller-75n6hxx.js">
<link rel="modulepreload" href="/assets/controllers/date-range-filter_controller--Cioe6M.js">
<link rel="modulepreload" href="/assets/controllers/project_work_day_controller-B-PAupX.js">
<link rel="modulepreload" href="/assets/controllers/preferred_payment_method_number_controller-HK8dsnP.js">
<link rel="modulepreload" href="/assets/controllers/timesheet_controller-YDTgQaK.js">
<link rel="modulepreload" href="/assets/controllers/work_history_dates_controller-aYYQJ72.js">
<link rel="modulepreload" href="/assets/controllers/hello_controller-it0EU__.js">
<link rel="modulepreload" href="/assets/controllers/preferred_state_tax_rate_controller-mXvuuxr.js">
<link rel="modulepreload" href="/assets/controllers/w4_inputs_dependents_controller-61Pzw-P.js">
<link rel="modulepreload" href="/assets/controllers/preferred_paystub_type_controller-sQK9dQ1.js">
<link rel="modulepreload" href="/assets/controllers/schedule_controller-0ev2Dlf.js">
<link rel="modulepreload" href="/assets/controllers/w4_inputs_other_controller-li11vY0.js">
<link rel="modulepreload" href="/assets/controllers/work_shift_bulk_lunch_controller-atAzSpW.js">
<link rel="modulepreload" href="/assets/controllers/timesheet_workshift_controller-NC3oa0K.js">
<link rel="modulepreload" href="/assets/controllers/debounce-form_controller-hkA4oGk.js">
<link rel="modulepreload" href="/assets/controllers/w4_active_controller-QLfmi6J.js">
<link rel="modulepreload" href="/assets/controllers/project_controller-jbk9v8F.js">
<link rel="modulepreload" href="/assets/controllers/preferred_payment_method_controller-zTxVgcQ.js">
<link rel="modulepreload" href="/assets/controllers/timesheet-commit_controller-22ofzoO.js">
<link rel="modulepreload" href="/assets/controllers/clock_controller-Q_nD4At.js">
<link rel="modulepreload" href="/assets/controllers/w4_inputs_filing_controller-5ekccX6.js">
<link rel="modulepreload" href="/assets/controllers/dashboard-active-users-company-chart_controller-cOuLzhX.js">
<link rel="modulepreload" href="/assets/controllers/paystub-company_controller-OhognUD.js">
<link rel="modulepreload" href="/assets/controllers/w4_inputs_multiple_controller-HE1yM_1.js">
<link rel="modulepreload" href="/assets/controllers/userdata_controller-_BsTXbq.js">
<link rel="modulepreload" href="/assets/controllers/paystub_date_controller-KUgYMHL.js">
<link rel="modulepreload" href="/assets/controllers/taxing_state_controller-x8Uo-bS.js">
<link rel="modulepreload" href="/assets/controllers/w4_inputs_deductions_controller-8JAjOph.js">
<link rel="modulepreload" href="/assets/controllers/click_guard_controller-N3B9TBe.js">
<link rel="modulepreload" href="/assets/controllers/hour_rate_controller-BOJ8LLl.js">
<link rel="modulepreload" href="/assets/controllers/w4_inputs_extra_controller-5GHBMxL.js">
<link rel="modulepreload" href="/assets/vendor/tom-select/tom-select.index-glUFqPA.js">
<link rel="modulepreload" href="/assets/vendor/chart.js/chart.js.index-06TNMkm.js">
<script type="module">import 'app';</script>    
    <script>
      (function () {
        if ('serviceWorker' in navigator) {
          window.addEventListener('load', function () {
            navigator.serviceWorker.register('/service-worker.js').catch(function (err) {
              console.warn('ServiceWorker registration failed:', err);
            });
          });
        }
      })();
    </script>
    <script>
      window.addEventListener('load', function () {
        const pad = document.getElementById('pinpad');
        const pin = document.getElementById('pin') || document.getElementById('clocker_pin_pin');
        if (pad && pin) {
          pad.addEventListener('click', function (e) {
            const btn = e.target.closest('button');
            if (!btn) return;
            const dig = btn.getAttribute('data-digit');
            const act = btn.getAttribute('data-action');
            if (dig) {
              if (pin.value.length < 4) {
                pin.value += dig;
              }
            }
            if (act === 'clear') {
              pin.value = pin.value.slice(0, -1);
            }
          });
        }
      });
    </script>
    </head>
<body class="page-login">
    <section class="min-h-screen flex items-center justify-center bg-gradient-to-br from-slate-50 to-slate-100">
        <div class="w-full max-w-xl bg-white shadow-lg rounded-xl p-6 md:p-8 mx-4">
            <div class="text-center mb-6">
                <div class="w-96 text-center mx-auto">

                    <img class="" src="/assets/images/logos/logo-light-MaYmnwk.png" alt="Logo"/>
                </div>
                <h1 class="text-2xl font-semibold">DreamJob Clocker</h1>
                <p class="mt-2 text-gray-600">Enter your site PIN to continue</p>
            </div>

            
            
            <form name="clocker_pin" method="post" class="space-y-4" autocomplete="off">
            <div>
                <label class="block text-sm font-medium mb-1 required" for="clocker_pin_pin">PIN</label>
                <input type="password" id="clocker_pin_pin" name="clocker_pin[pin]" required="required" autocomplete="off" inputmode="numeric" pattern="[0-9]*" placeholder="Enter PIN" id="pin" maxlength="4" minlength="4" class="w-full border rounded px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 text-center tracking-widest text-2xl" />
                
            </div>

            <div class="grid grid-cols-3 gap-3 select-none" id="pinpad">
                                    <button type="button" data-digit="1"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">1</button>
                                    <button type="button" data-digit="2"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">2</button>
                                    <button type="button" data-digit="3"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">3</button>
                                    <button type="button" data-digit="4"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">4</button>
                                    <button type="button" data-digit="5"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">5</button>
                                    <button type="button" data-digit="6"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">6</button>
                                    <button type="button" data-digit="7"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">7</button>
                                    <button type="button" data-digit="8"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">8</button>
                                    <button type="button" data-digit="9"
                            class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">9</button>
                                <button type="button" data-action="clear"
                        class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">⌫
                </button>
                <button type="button" data-digit="0" class="py-4 text-xl rounded bg-white shadow hover:bg-slate-50">0
                </button>
                <button type="submit" class="py-4 text-xl rounded bg-blue-600 text-white shadow hover:bg-blue-700">OK
                </button>
            </div>

            <button type="submit"
                    class="w-full bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md shadow">
                Continue
            </button>
            <input type="hidden" id="clocker_pin__token" name="clocker_pin[_token]" data-controller="csrf-protection" class=" mt-1 w-full form-input" value="csrf-token" /></form>
        </div>
    </section>
</body>
</html>
