@extends('layouts.app')
@section('title', 'Cambiar Contraseña')
@section('body')
<div class="min-h-screen flex items-center justify-center">
    <div class="grid grid-cols-1 md:grid-cols-10 gap-4 w-full min-h-screen max-w-[2000px] mx-auto">
        <div class="flex flex-col justify-center p-[20px] lg:px-[50px] xl:px-90px] md:col-span-4 max-w-2xl">
            <a href="/login">
                <div class="flex items-center ms-2 mb-12 hover:cursor-pointer">
                    <img src="{{  env('VITE_CDN_URL_ASSETS').'/icons/arrow_back.svg' }}" alt="">
                    <p class="text-neutral-600">Volver</p>
                </div>
            </a>
            <img src="{{ env('APP_THEME') == 'vaope' ? 'https://static.vaope.com/public/repository/2644-logo-vaope.png' : 'https://static.vaope.com/public/repository/5824-tuentrada.png' }}" width="144" alt="" class="mb-6">
            <div class="ps-2">
                <h1 class="text-2xl font-bold mb-2">Cambiar Contraseña</h1>
                <p class="mb-10">Ingresa tu nueva contraseña.</p>
                <new-password-form :token="{{ json_encode($token) }}" :email="{{ json_encode($email) }}"></new-password-form>
            </div>
        </div>
        <div class="hidden md:block md:col-span-6">
            <img src="{{env('APP_THEME') == 'vaope' ? env('VITE_CDN_URL_ASSETS').'/vaope/image-login.svg' :  env('VITE_CDN_URL_ASSETS').'/login-bg.png'}}"  loading="lazy" alt="Login Image" class="w-screen h-screen object-cover"/>
        </div>
    </div>
</div>
@endsection