/* /Layout/MainLayout.razor.rz.scp.css */
.app-shell[b-edtzg9hjb0] {
    display: flex;
    min-height: 100vh;
    background: var(--hrms-bg, #f0f2f8);
}

.app-sidebar[b-edtzg9hjb0] {
    width: 260px;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    height: 100vh;
    z-index: 100;
}

.app-main[b-edtzg9hjb0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.app-topbar[b-edtzg9hjb0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.75rem;
    background: var(--hrms-surface, #fff);
    border-bottom: 1px solid var(--hrms-border, #e8ecf4);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    position: sticky;
    top: 0;
    z-index: 50;
}

.topbar-title[b-edtzg9hjb0] {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--hrms-text, #1e293b);
    letter-spacing: -0.02em;
}

.topbar-subtitle[b-edtzg9hjb0] {
    font-size: 0.8rem;
    display: block;
    margin-top: 0.1rem;
}

.topbar-user[b-edtzg9hjb0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.35rem 0.75rem 0.35rem 0.35rem;
    background: var(--hrms-bg-muted, #f8fafc);
    border-radius: 999px;
    border: 1px solid var(--hrms-border, #e8ecf4);
}

.user-avatar[b-edtzg9hjb0] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--hrms-primary, #4f46e5), var(--hrms-accent, #06b6d4));
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    flex-shrink: 0;
    overflow: hidden;
}

.user-avatar img[b-edtzg9hjb0] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.user-avatar-lg[b-edtzg9hjb0] {
    width: 72px;
    height: 72px;
    font-size: 1.25rem;
}

.user-avatar-sm[b-edtzg9hjb0] {
    width: 32px;
    height: 32px;
    font-size: 0.65rem;
}

.user-meta[b-edtzg9hjb0] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.user-name[b-edtzg9hjb0] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--hrms-text, #1e293b);
    text-transform: capitalize;
}

.user-email[b-edtzg9hjb0] {
    font-size: 0.72rem;
    color: var(--hrms-text-muted, #64748b);
}

.app-content[b-edtzg9hjb0] {
    flex: 1;
    padding: 1.5rem 1.75rem 2rem;
}

@media (max-width: 768px) {
    .app-shell[b-edtzg9hjb0] {
        flex-direction: column;
    }

    .app-sidebar[b-edtzg9hjb0] {
        width: 100%;
        height: auto;
        position: relative;
    }

    .app-content[b-edtzg9hjb0] {
        padding: 1rem;
    }

    .topbar-subtitle[b-edtzg9hjb0] {
        display: none !important;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.sidebar-inner[b-j5elwk7er9] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background: linear-gradient(180deg, #1e1b4b 0%, #312e81 45%, #1e293b 100%);
    color: #e2e8f0;
    box-shadow: 4px 0 24px rgba(15, 23, 42, 0.12);
}

.sidebar-brand[b-j5elwk7er9] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1.25rem 1.25rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.brand-logo[b-j5elwk7er9] {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: linear-gradient(135deg, #06b6d4, #6366f1);
    color: #fff;
    font-weight: 800;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sidebar-brand strong[b-j5elwk7er9] {
    display: block;
    font-size: 1.05rem;
    color: #fff;
    letter-spacing: -0.02em;
}

.sidebar-brand small[b-j5elwk7er9] {
    display: block;
    font-size: 0.7rem;
    color: #94a3b8;
    margin-top: 0.1rem;
}

.sidebar-nav[b-j5elwk7er9] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 0.75rem 1rem;
}

.nav-section-label[b-j5elwk7er9] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
    padding: 0.75rem 0.75rem 0.35rem;
    margin-top: 0.25rem;
}

.nav-section-label:first-child[b-j5elwk7er9] {
    margin-top: 0;
}

.nav-item[b-j5elwk7er9] {
    margin-bottom: 0.15rem;
}

.nav-item[b-j5elwk7er9]  a.nav-link {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.6rem 0.85rem;
    border-radius: 10px;
    color: #cbd5e1;
    font-size: 0.9rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    height: auto;
    line-height: 1.4;
}

.nav-item[b-j5elwk7er9]  a.nav-link:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

.nav-item[b-j5elwk7er9]  a.nav-link.active {
    background: linear-gradient(90deg, rgba(99, 102, 241, 0.45), rgba(6, 182, 212, 0.25));
    color: #fff;
    box-shadow: inset 3px 0 0 #22d3ee;
}

.nav-icon[b-j5elwk7er9] {
    width: 1.65rem;
    height: 1.65rem;
    flex-shrink: 0;
    opacity: 1;
    background-size: 1rem 1rem;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 8px;
}

.icon-dashboard[b-j5elwk7er9] {
    background-color: rgba(56, 189, 248, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2338bdf8' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m4 1a2 2 0 1 0 0-4 2 2 0 0 0 0 4m-8 0a2 2 0 1 0 0-4 2 2 0 0 0 0 4'/%3E%3Cpath d='M8 4.5a.5.5 0 0 1 .5.5v5h5a.5.5 0 0 1 0 1h-5v5a.5.5 0 0 1-1 0v-5h-5a.5.5 0 0 1 0-1h5v-5A.5.5 0 0 1 8 4.5'/%3E%3C/svg%3E");
}
.icon-employees[b-j5elwk7er9] {
    background-color: rgba(129, 140, 248, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23818cf8' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4 5c0 0 1 0 1-1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6m-5.784 6A2.24 2.24 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.3 6.3 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5'/%3E%3C/svg%3E");
}
.icon-interviews[b-j5elwk7er9] {
    background-color: rgba(45, 212, 191, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%232dd4bf' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 1A1.5 1.5 0 0 0 5 2.5V3H1.5A1.5 1.5 0 0 0 0 4.5v8A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-8A1.5 1.5 0 0 0 14.5 3H11v-.5A1.5 1.5 0 0 0 9.5 1zm0 1h3a.5.5 0 0 1 .5.5V3H6v-.5a.5.5 0 0 1 .5-.5m1.886 6.914L15 7.151V12.5a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5V7.15l6.614 1.764a1.5 1.5 0 0 0 .772 0M1.5 4h13a.5.5 0 0 1 .5.5v1.616L8.129 7.948a.5.5 0 0 1-.258 0L1 6.116V4.5a.5.5 0 0 1 .5-.5'/%3E%3C/svg%3E");
}
.icon-masters[b-j5elwk7er9] {
    background-color: rgba(167, 139, 250, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23a78bfa' viewBox='0 0 16 16'%3E%3Cpath d='M1 2.5A1.5 1.5 0 0 1 2.5 1h3A1.5 1.5 0 0 1 7 2.5v3A1.5 1.5 0 0 1 5.5 7h-3A1.5 1.5 0 0 1 1 5.5z'/%3E%3C/svg%3E");
}
.icon-leave[b-j5elwk7er9] {
    background-color: rgba(52, 211, 153, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2334d399' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8v-.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1v-.5a.5.5 0 0 1 .5-.5'/%3E%3C/svg%3E");
}
.icon-attendance[b-j5elwk7er9] {
    background-color: rgba(251, 191, 36, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fbbf24' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71z'/%3E%3Cpath d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0'/%3E%3C/svg%3E");
}
.icon-holidays[b-j5elwk7er9] {
    background-color: rgba(244, 114, 182, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f472b6' viewBox='0 0 16 16'%3E%3Cpath d='M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2z'/%3E%3C/svg%3E");
}
.icon-expenses[b-j5elwk7er9] {
    background-color: rgba(74, 222, 128, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%234ade80' viewBox='0 0 16 16'%3E%3Cpath d='M4 10.781c.148 1.667 1.513 2.85 3.591 3.003V15h1.043v-1.216c2.27-.179 3.678-1.438 3.678-3.3 0-1.59-1.09-2.89-2.925-3.2V6.5c1.09-.271 1.936-1.11 1.936-2.25 0-1.49-1.27-2.57-3.055-2.57H5.5C3.784 1.68 2 2.9 2 4.5c0 1.31.845 2.38 2.084 2.684'/%3E%3C/svg%3E");
}
.icon-assets[b-j5elwk7er9] {
    background-color: rgba(251, 146, 60, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fb923c' viewBox='0 0 16 16'%3E%3Cpath d='M6 12.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1H6.5a.5.5 0 0 1-.5-.5M3.854 8.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708l3-3a.5.5 0 0 1 .708 0'/%3E%3C/svg%3E");
}
.icon-documents[b-j5elwk7er9] {
    background-color: rgba(96, 165, 250, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2360a5fa' viewBox='0 0 16 16'%3E%3Cpath d='M14 4.5V14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h5.5z'/%3E%3C/svg%3E");
}
.icon-audit[b-j5elwk7er9] {
    background-color: rgba(192, 132, 252, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23c084fc' viewBox='0 0 16 16'%3E%3Cpath d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.93-9.412-1 4.705c-.07.34.029.699.27.957.26.29.684.361 1.037.225l4.988-1.902a1 1 0 0 0 .611-.923l-1.902-4.988a1 1 0 0 0-1.037-.225c-.26.29-.361.684-.225 1.037z'/%3E%3C/svg%3E");
}
.icon-reports[b-j5elwk7er9] {
    background-color: rgba(45, 212, 191, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%232dd4bf' viewBox='0 0 16 16'%3E%3Cpath d='M0 0h1v15h15v1H0zm14.817 3.113a.5.5 0 0 1 .07.704l-4.5 5.5a.5.5 0 0 1-.74.037L7.06 6.767l-3.656 5.027a.5.5 0 0 1-.808-.588l4-5.5a.5.5 0 0 1 .758-.06l2.609 2.61 4.15-5.073a.5.5 0 0 1 .704-.07'/%3E%3C/svg%3E");
}
.icon-notifications[b-j5elwk7er9] {
    background-color: rgba(250, 204, 21, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23facc15' viewBox='0 0 16 16'%3E%3Cpath d='M8 16a2 2 0 0 0 2-2H6a2 2 0 0 0 2 2M8 1.918l-.797.161A4 4 0 0 0 4 6c0 .628-.134 2.197-.459 3.742-.16.767-.376 1.566-.663 2.258h10.244c-.287-.692-.502-1.49-.663-2.258C12.134 8.197 12 6.628 12 6a4 4 0 0 0-3.203-3.92z'/%3E%3C/svg%3E");
}
.icon-logout[b-j5elwk7er9] {
    background-color: rgba(248, 113, 113, 0.18);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f87171' viewBox='0 0 16 16'%3E%3Cpath d='M6 12.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3'/%3E%3Cpath fill-rule='evenodd' d='M10.5 1.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-j5elwk7er9]  a.active .nav-icon {
    filter: brightness(1.12);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.nav-badge[b-j5elwk7er9] {
    margin-left: auto;
    background: #ef4444;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    min-width: 1.25rem;
    text-align: center;
}

.sidebar-footer[b-j5elwk7er9] {
    padding: 1rem 0.75rem 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.btn-logout[b-j5elwk7er9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.35);
    color: #fca5a5;
    font-weight: 600;
    font-size: 0.85rem;
    padding: 0.55rem 1rem;
    border-radius: 10px;
    transition: background 0.15s;
}

.btn-logout:hover[b-j5elwk7er9] {
    background: rgba(239, 68, 68, 0.28);
    color: #fff;
}

@media (max-width: 768px) {
    .sidebar-inner[b-j5elwk7er9] {
        height: auto;
        min-height: auto;
    }

    .sidebar-nav[b-j5elwk7er9] {
        max-height: 50vh;
    }
}