<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>@yield('title', 'Movex Canada HR CRM')</title>
    <style>
        :root{--green:#0f7a4f;--green2:#14a66f;--light:#f5fbf7;--ink:#17231d;--muted:#667085;--line:#e4e7ec;--danger:#b42318;--warn:#b54708;--card:#fff}
        *{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f6f8fa;color:var(--ink)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.shell{display:flex;min-height:100vh}.sidebar{width:280px;background:#102319;color:#fff;padding:22px;position:fixed;top:0;bottom:0;left:0;overflow:auto}.brand{display:flex;align-items:center;gap:10px;margin-bottom:22px}.logo{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--green2),#c4f000);display:grid;place-items:center;color:#07351f;font-weight:900}.brand h1{font-size:18px;margin:0}.brand span{font-size:12px;color:#b8d6c6}.nav-title{margin:22px 0 8px;color:#98b8a8;font-size:11px;text-transform:uppercase;letter-spacing:.09em}.nav a,.logout-btn{display:flex;align-items:center;gap:10px;width:100%;padding:11px 12px;border-radius:12px;color:#eef8f2;background:transparent;border:0;text-align:left;cursor:pointer}.nav a:hover,.logout-btn:hover,.nav a.active{background:rgba(255,255,255,.1)}.main{margin-left:280px;width:calc(100% - 280px);padding:26px}.topbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:22px}.topbar h2{margin:0;font-size:25px}.topbar p{margin:4px 0 0;color:var(--muted)}.userpill{background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:999px;box-shadow:0 6px 22px rgba(16,24,40,.06)}.grid{display:grid;gap:16px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:0 10px 35px rgba(16,24,40,.06);margin-bottom:16px}.stat{padding:18px;border-radius:18px;background:linear-gradient(135deg,#fff,#effaf4);border:1px solid #d9efe4}.stat strong{display:block;font-size:28px;margin-top:8px}.muted{color:var(--muted)}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.table th{font-size:12px;color:#667085;text-transform:uppercase;background:#fbfbfb}.badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:12px;background:#eef4ff;color:#3538cd}.badge.green{background:#dcfae6;color:#067647}.badge.red{background:#fee4e2;color:#b42318}.badge.yellow{background:#fef0c7;color:#b54708}.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{margin-bottom:12px}.field label{display:block;font-weight:700;font-size:13px;margin-bottom:6px}.input,select,textarea{width:100%;padding:11px 12px;border:1px solid #d0d5dd;border-radius:12px;background:#fff}textarea{min-height:95px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--green);color:#fff;padding:10px 14px;border:0;border-radius:12px;cursor:pointer;font-weight:700}.btn.secondary{background:#eef2f6;color:#344054}.btn.danger{background:var(--danger)}.btn.warn{background:var(--warn)}.actions{display:flex;gap:8px;flex-wrap:wrap}.alert{padding:12px 14px;border-radius:14px;margin-bottom:14px}.alert.success{background:#dcfae6;color:#067647}.alert.error{background:#fee4e2;color:#b42318}.pagination{margin-top:14px}.small{font-size:12px}.split{display:flex;justify-content:space-between;gap:12px;align-items:center}.auth-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at top left,#d8ffe6,#f7fafc 45%,#e6f4ff)}.auth-card{width:min(480px,100%);background:#fff;border-radius:26px;padding:28px;box-shadow:0 24px 80px rgba(16,24,40,.14);border:1px solid var(--line)}.auth-card h1{margin:8px 0 6px}.auth-logo{width:56px;height:56px;border-radius:18px;background:linear-gradient(135deg,var(--green2),#c4f000);display:grid;place-items:center;font-weight:900;color:#07351f}.help{background:#fffbeb;border:1px solid #fedf89;color:#93370d;border-radius:16px;padding:12px;margin:12px 0}.section-title{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.section-title h3{margin:0}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.empty{padding:26px;text-align:center;color:#667085;background:#fbfbfb;border-radius:16px;border:1px dashed #d0d5dd}@media(max-width:900px){.sidebar{position:relative;width:100%;bottom:auto}.shell{display:block}.main{margin-left:0;width:100%;padding:18px}.grid-2,.grid-3,.grid-4,.form-row{grid-template-columns:1fr}.topbar{display:block}.userpill{margin-top:12px;display:inline-block}}
    </style>
</head>
<body>
@auth
<div class="shell">
    <aside class="sidebar">
        <div class="brand">
            <div class="logo">HR</div>
            <div><h1>Movex Canada</h1><span>Human Resource CRM</span></div>
        </div>
        <nav class="nav">
            @if(auth()->user()->isAdmin())
                <div class="nav-title">Admin</div>
                <a class="{{ request()->routeIs('admin.dashboard') ? 'active' : '' }}" href="{{ route('admin.dashboard') }}">Dashboard</a>
                <a class="{{ request()->routeIs('admin.employees*') ? 'active' : '' }}" href="{{ route('admin.employees') }}">Employees</a>
                <a class="{{ request()->routeIs('admin.departments') ? 'active' : '' }}" href="{{ route('admin.departments') }}">Departments</a>
                <a class="{{ request()->routeIs('admin.designations') ? 'active' : '' }}" href="{{ route('admin.designations') }}">Designations</a>
                <a class="{{ request()->routeIs('admin.attendance') ? 'active' : '' }}" href="{{ route('admin.attendance') }}">Attendance</a>
                <a class="{{ request()->routeIs('admin.leaves') ? 'active' : '' }}" href="{{ route('admin.leaves') }}">Leave Management</a>
                <a class="{{ request()->routeIs('admin.payrolls') ? 'active' : '' }}" href="{{ route('admin.payrolls') }}">Payroll</a>
                <a class="{{ request()->routeIs('admin.documents') ? 'active' : '' }}" href="{{ route('admin.documents') }}">Documents</a>
                <a class="{{ request()->routeIs('admin.performance') ? 'active' : '' }}" href="{{ route('admin.performance') }}">Performance</a>
                <a class="{{ request()->routeIs('admin.jobs') || request()->routeIs('admin.applications') ? 'active' : '' }}" href="{{ route('admin.jobs') }}">Recruitment</a>
                <a class="{{ request()->routeIs('admin.trainings') ? 'active' : '' }}" href="{{ route('admin.trainings') }}">Training</a>
                <a class="{{ request()->routeIs('admin.tickets') ? 'active' : '' }}" href="{{ route('admin.tickets') }}">HR Tickets</a>
                <a class="{{ request()->routeIs('admin.discipline') ? 'active' : '' }}" href="{{ route('admin.discipline') }}">Discipline</a>
                <a class="{{ request()->routeIs('admin.announcements') ? 'active' : '' }}" href="{{ route('admin.announcements') }}">Announcements</a>
            @endif
            <div class="nav-title">User Portal</div>
            <a class="{{ request()->routeIs('user.dashboard') ? 'active' : '' }}" href="{{ route('user.dashboard') }}">My Dashboard</a>
            <a class="{{ request()->routeIs('user.profile') ? 'active' : '' }}" href="{{ route('user.profile') }}">My Profile</a>
            <a class="{{ request()->routeIs('user.attendance') ? 'active' : '' }}" href="{{ route('user.attendance') }}">My Attendance</a>
            <a class="{{ request()->routeIs('user.leaves') ? 'active' : '' }}" href="{{ route('user.leaves') }}">My Leave</a>
            <a class="{{ request()->routeIs('user.payslips') ? 'active' : '' }}" href="{{ route('user.payslips') }}">My Payslips</a>
            <a class="{{ request()->routeIs('user.documents') ? 'active' : '' }}" href="{{ route('user.documents') }}">My Documents</a>
            <a class="{{ request()->routeIs('user.performance') ? 'active' : '' }}" href="{{ route('user.performance') }}">My Performance</a>
            <a class="{{ request()->routeIs('user.trainings') ? 'active' : '' }}" href="{{ route('user.trainings') }}">My Trainings</a>
            <a class="{{ request()->routeIs('user.tickets') ? 'active' : '' }}" href="{{ route('user.tickets') }}">HR Support</a>
            <a class="{{ request()->routeIs('user.announcements') ? 'active' : '' }}" href="{{ route('user.announcements') }}">Announcements</a>
            <form method="POST" action="{{ route('logout') }}" style="margin-top:22px">@csrf<button class="logout-btn" type="submit">Logout</button></form>
        </nav>
    </aside>
    <main class="main">
        <div class="topbar">
            <div><h2>@yield('page_title', 'Dashboard')</h2><p>@yield('page_subtitle', 'Manage HR operations from one place.')</p></div>
            <div class="userpill"><strong>{{ auth()->user()->name }}</strong> <span class="muted">({{ strtoupper(auth()->user()->role) }})</span></div>
        </div>
        @include('layouts.flash')
        @yield('content')
    </main>
</div>
@else
    @yield('content')
@endauth
</body>
</html>
