*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Arial,sans-serif;background:#f4f7fb;color:#172033}a{text-decoration:none;color:#1b66d1}.app-shell{display:flex;min-height:100vh}.sidebar{width:250px;background:linear-gradient(180deg,#0d2946,#081d33);color:white;padding:24px 18px;position:fixed;top:0;bottom:0}.brand{font-size:24px;margin-bottom:32px;display:flex;gap:10px;align-items:center}.clock-icon{border:2px solid #6aa5ff;border-radius:50%;padding:4px;color:#6aa5ff; width:65px}.sidebar nav{display:flex;flex-direction:column;gap:8px}.sidebar a{color:white;padding:13px 14px;border-radius:8px;font-size:14px}.sidebar a:hover{background:#1f6fe5}.user-box{position:absolute;bottom:25px;left:18px;right:18px;background:rgba(255,255,255,.08);padding:12px;border-radius:12px}.content{margin-left:250px;padding:28px;width:calc(100% - 250px)}.page-header{margin-bottom:20px}.page-header h2{margin:0;font-size:28px}.page-header p,.muted{color:#667085}.card{background:white;border:1px solid #e5eaf2;border-radius:14px;padding:22px;box-shadow:0 8px 24px rgba(16,24,40,.06)}.mt{margin-top:20px}.mb{margin-bottom:20px}.row-between{display:flex;justify-content:space-between;align-items:center}.login-wrapper{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:30px}.login-left{height:620px;width:410px;background:linear-gradient(180deg,#0b3764,#07284b);color:white;border-radius:14px 0 0 14px;padding:50px;text-align:center}.logo-big{font-size:30px;font-weight:700}.illustration{font-size:90px;margin:100px 0 40px}.login-card{height:620px;width:430px;background:white;border-radius:0 14px 14px 0;padding:45px;box-shadow:0 10px 32px rgba(16,24,40,.12)}label{display:block;font-size:14px;font-weight:600;margin:14px 0 7px}input,select,textarea{width:100%;border:1px solid #d9e1ec;border-radius:8px;padding:12px;font-size:14px;background:white}textarea{min-height:85px;resize:vertical}.check{display:flex;align-items:center;gap:8px;font-weight:400}.check input{width:auto}.btn-primary{background:#1f6fe5;color:white;border:0;border-radius:8px;padding:12px 20px;font-weight:600;cursor:pointer}.btn-primary:hover{background:#1458bd}.btn-light{background:#f1f5f9;color:#172033;border:1px solid #d9e1ec;border-radius:8px;padding:12px 20px}.role-info{margin-top:28px;background:#eef6ff;border:1px solid #bdd8ff;border-radius:10px;padding:16px}.demo-users{font-size:12px;color:#667085}.error{color:#dc2626;font-size:13px}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.stat-card{background:white;border:1px solid #e5eaf2;border-radius:14px;padding:22px;box-shadow:0 8px 24px rgba(16,24,40,.06)}.stat-card span{color:#667085}.stat-card b{display:block;font-size:28px;margin-top:10px}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:14px 12px;border-bottom:1px solid #e5eaf2;text-align:left;font-size:14px}.table th{background:#f8fafc;color:#344054}.badge{display:inline-block;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:600}.green{background:#dcfce7;color:#15803d}.gray{background:#e5e7eb;color:#374151}.blue{background:#e0efff;color:#1d4ed8}.inline-form{display:grid;grid-template-columns:1fr 2fr auto;gap:12px}.inline{display:inline}.icon-btn{border:1px solid #e5eaf2;background:white;border-radius:6px;padding:7px;cursor:pointer}.entry-layout{display:grid;grid-template-columns:1fr 350px;gap:20px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.success-input{background:#e8f9ef;color:#087443;font-weight:700}.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:18px}.summary-line{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #eef2f6}.summary-total{display:flex;justify-content:space-between;font-size:18px;margin-top:15px}.summary-total b{background:#e8f1ff;color:#0f4aa3;padding:10px 20px;border-radius:8px}@media(max-width:900px){.sidebar{position:relative;width:100%}.app-shell{display:block}.content{margin-left:0;width:100%}.entry-layout,.grid-3,.stats-grid,.inline-form{grid-template-columns:1fr}.login-wrapper{display:block}.login-left,.login-card{width:100%;height:auto;border-radius:14px;margin-bottom:15px}}
.sidebar-link {
    display: block;
    color: #fff;
    text-decoration: none;
    padding: 8px 12px;
}

.submenu-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px 8px 35px;
    color: #d7e3f4;
    text-decoration: none;
    font-size: 14px;
}

    .submenu-link:hover {
        background: #1b4d82;
        color: #fff;
        border-radius: 6px;
    }

    .submenu-link i {
        width: 18px;
        text-align: center;
    }

/* ============================
   DOCUMENT LINKS
============================ */

.document-menu {
    position: absolute;
    bottom: 105px;
    left: 18px;
    right: 18px;
    display: flex;
    gap: 8px;
    padding: 0;
}

    /* Guideline + User Manual */
    .document-menu a {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 9px 6px;
        color: #dbeafe;
        background: rgba(255, 255, 255, 0.06);
        border-radius: 8px;
        font-size: 12px;
        text-decoration: none;
        transition: all 0.2s ease;
    }

        /* Icons */
        .document-menu a i {
            font-size: 13px;
        }

        /* Hover */
        .document-menu a:hover {
            background: rgba(255, 255, 255, 0.14);
            color: #ffffff;
        }

/* User profile */
.user-box {
    position: absolute;
    bottom: 25px;
    left: 18px;
    right: 18px;
    background: rgba(255, 255, 255, 0.08);
    padding: 12px;
    border-radius: 12px;
}

    .user-box div {
        font-size: 15px;
        margin-bottom: 4px;
    }

    .user-box small {
        color: #d7e3f4;
        font-size: 12px;
    }