<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@yield('title','Login') — HRMS</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
    <style>
        body { font-family:'Plus Jakarta Sans',sans-serif; background:#0a1628; min-height:100vh; display:flex; align-items:center; justify-content:center; }
        .auth-wrapper { width:100%; max-width:430px; padding:1rem; }
        .auth-card { background:#fff; border-radius:24px; padding:2.5rem; box-shadow:0 24px 64px rgba(0,0,0,.35); }
        .auth-logo { width:64px;height:64px;background:linear-gradient(135deg,#D4AF37,#b8860b);border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.4rem;color:#0a1628;margin:0 auto 1.25rem;box-shadow:0 8px 24px rgba(212,175,55,.4); }
        .auth-title { font-weight:800;font-size:1.6rem;color:#0a1628;text-align:center;margin-bottom:.25rem; }
        .auth-sub   { font-size:.85rem;color:#94a3b8;text-align:center;margin-bottom:2rem; }
        .form-control { border-radius:10px;border-color:#dde3ea;padding:.6rem .9rem;font-size:.9rem; }
        .form-control:focus { border-color:#003366;box-shadow:0 0 0 3px rgba(0,51,102,.12); }
        .form-label { font-weight:600;font-size:.82rem;color:#374151; }
        .btn-primary { background:linear-gradient(135deg,#003366,#0055b3);border:none;border-radius:12px;padding:.7rem;font-weight:700;font-size:.9rem;letter-spacing:.01em; }
        .btn-primary:hover { background:linear-gradient(135deg,#002244,#003d80); }
        .bg-pattern { position:fixed;inset:0;background:radial-gradient(ellipse at 20% 50%,rgba(0,85,179,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(212,175,55,.1) 0%,transparent 50%); pointer-events:none; }
        .hint-box { background:#f0f4f8;border-radius:12px;padding:1rem;font-size:.78rem;color:#64748b;margin-top:1rem; }
    </style>
</head>
<body>
<div class="bg-pattern"></div>
<div class="auth-wrapper">
    <div class="auth-card">
        <div class="auth-logo">{{ strtoupper(substr(config('hrms.company_code','HR'),0,2)) }}</div>
        <h1 class="auth-title">{{ config('app.name', 'HRMS') }}</h1>
        <p class="auth-sub">Human Resource Management System</p>
        @yield('content')
    </div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
