@import '_content/Blazicons/Blazicons.ugzwxlf6d1.bundle.scp.css';

/* _content/Hirelab-frontend/Components/Layout/MainLayout.razor.rz.scp.css */
*[b-o3uwv2jook] {
    box-sizing: border-box;
}

html[b-o3uwv2jook], body[b-o3uwv2jook] {
    overflow-x: hidden;
    width: 100%;
}

/* Theme Loading Screen */
.theme-loading-screen[b-o3uwv2jook] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    margin: 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    box-sizing: border-box;
    z-index: 999999;
    pointer-events: auto;
}

.theme-loading-screen:not(.visible)[b-o3uwv2jook] {
    display: none !important;
    pointer-events: none !important;
}

.theme-loading-content[b-o3uwv2jook] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
}

.theme-loading-spinner[b-o3uwv2jook] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top-color: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    animation: themeSpin-b-o3uwv2jook 1s linear infinite;
}

.theme-loading-text[b-o3uwv2jook] {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1rem;
    font-weight: 500;
    margin: 0;
}

@keyframes themeSpin-b-o3uwv2jook {
    to {
        transform: rotate(360deg);
    }
}

.app-container[b-o3uwv2jook] {
    min-height: 100vh;
    display: flex;
    overflow-x: hidden;
    width: 100%;
    background-color: #f5f5f5 !important;
}

/* Minimized Sidebar */
.app-sidebar[b-o3uwv2jook] {
    position: fixed;
    top: 0;
    left: 0;
    width: 60px;
    height: 100vh;
    background: var(--tenant-primary-color, #594ae2);
    color: var(--tenant-text-color, white);
    overflow-y: auto;
    overflow-x: hidden;
    transition: width 0.3s ease;
    z-index: 998;
    display: flex;
    flex-direction: column;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.1);
}

.app-sidebar.open[b-o3uwv2jook] {
    width: 256px;
}

.app-sidebar.closed[b-o3uwv2jook] {
    width: 60px;
}

/* Mobile backdrop overlay */
.sidebar-backdrop[b-o3uwv2jook] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    animation: fadeIn-b-o3uwv2jook 0.3s ease;
}

@keyframes fadeIn-b-o3uwv2jook {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Mobile App Bar */
.mobile-app-bar[b-o3uwv2jook] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 56px;
    background: var(--tenant-primary-color, #594ae2);
    color: var(--tenant-text-color, white);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    align-items: center;
    padding: 0 16px;
    gap: 16px;
}

.mobile-menu-button[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.95);
    border: none;
    color: #000;
    cursor: pointer;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.mobile-menu-button:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.mobile-menu-button:active[b-o3uwv2jook] {
    background: rgba(240, 240, 240, 1);
    transform: scale(0.95);
}

.mobile-menu-button .material-icons[b-o3uwv2jook] {
    font-size: 24px;
    color: #000;
    font-weight: 500;
}

.mobile-app-title[b-o3uwv2jook] {
    flex: 1;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--tenant-text-color, white);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-left: 8px;
}

/* Mobile User Account Dropdown */
.mobile-user-account[b-o3uwv2jook] {
    position: relative;
    margin-left: auto;
    flex-shrink: 0;
}

.mobile-user-info[b-o3uwv2jook] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.2s ease;
    color: var(--tenant-text-color, white);
    user-select: none;
}

.mobile-user-info:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.15);
}

.mobile-user-info .user-icon[b-o3uwv2jook] {
    font-size: 28px;
}

.mobile-user-info .menu-arrow[b-o3uwv2jook] {
    font-size: 18px;
    transition: transform 0.3s ease;
}

.mobile-user-info .menu-arrow.rotated[b-o3uwv2jook] {
    transform: rotate(180deg);
}

.mobile-user-menu[b-o3uwv2jook] {
    position: absolute;
    bottom: calc(100% + 8px);
    right: 0;
    min-width: 200px;
    max-width: calc(100vw - 32px);
    background: white;
    border-radius: 8px;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.15);
    padding: 8px;
    display: flex;
    flex-direction: column-reverse;
    gap: 4px;
    z-index: 1001;
    animation: slideUpMobile-b-o3uwv2jook 0.2s ease;
}

.mobile-user-menu .user-menu-item[b-o3uwv2jook] {
    color: #333;
    padding: 12px;
    font-size: 14px;
}

.mobile-user-menu .user-menu-item:hover[b-o3uwv2jook] {
    background: rgba(0, 0, 0, 0.05);
}

.mobile-user-menu .user-menu-item.logout[b-o3uwv2jook] {
    color: #ff6b6b;
}

.mobile-user-menu .user-menu-item.logout:hover[b-o3uwv2jook] {
    background: rgba(255, 107, 107, 0.1);
}

.mobile-login-button[b-o3uwv2jook] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    color: var(--tenant-text-color, white);
    text-decoration: none;
    transition: all 0.2s ease;
    width: 40px;
    height: 40px;
    margin-left: auto;
    flex-shrink: 0;
}

.mobile-login-button:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.25);
}

.mobile-login-button .material-icons[b-o3uwv2jook] {
    font-size: 24px;
}

/* Sidebar Header */
.sidebar-header[b-o3uwv2jook] {
    padding: 8px 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
}

.menu-toggle[b-o3uwv2jook] {
    background: transparent;
    border: none;
    color: var(--tenant-text-color, white);
    cursor: pointer;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    transition: background 0.2s;
    width: 44px;
    height: 44px;
    margin: 0 auto;
}

.menu-toggle:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.15);
}

.menu-toggle .material-icons[b-o3uwv2jook] {
    font-size: 24px;
}

.sidebar-header-content[b-o3uwv2jook] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    opacity: 1;
    transition: opacity 0.2s ease;
}

.sidebar-header-content.hidden[b-o3uwv2jook] {
    opacity: 0;
    pointer-events: none;
    height: 0;
    overflow: hidden;
}

.tenant-info[b-o3uwv2jook] {
    flex: 1;
    min-width: 0;
    padding-left: 12px;
}

.sidebar-title[b-o3uwv2jook] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-subtitle[b-o3uwv2jook] {
    margin: 4px 0 0 0;
    font-size: 11px;
    opacity: 0.8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lock-toggle[b-o3uwv2jook] {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--tenant-text-color, white);
    cursor: pointer;
    padding: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
    opacity: 0.7;
    flex-shrink: 0;
}

.lock-toggle:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.1);
    opacity: 1;
    border-color: rgba(255, 255, 255, 0.4);
}

.lock-toggle.locked[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.4);
    opacity: 1;
}

.lock-toggle .material-icons[b-o3uwv2jook] {
    font-size: 20px;
}

/* Sidebar Navigation */
.sidebar-nav[b-o3uwv2jook] {
    padding: 4px;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.custom-nav-link[b-o3uwv2jook] {
    display: flex;
    align-items: center;
    padding: 12px 8px;
    color: var(--tenant-text-color, white);
    text-decoration: none;
    border-radius: 8px;
    margin-bottom: 4px;
    transition: all 0.2s ease-in-out;
    font-weight: 400;
    position: relative;
    white-space: nowrap;
}

.app-sidebar.closed .custom-nav-link[b-o3uwv2jook] {
    justify-content: center;
    padding: 12px 4px;
}

.app-sidebar.open .custom-nav-link[b-o3uwv2jook] {
    padding-left: 12px;
}

.custom-nav-link:hover[b-o3uwv2jook] {
    background-color: rgba(255, 255, 255, 0.15);
}

.custom-nav-link:active[b-o3uwv2jook] {
    background-color: rgba(255, 255, 255, 0.2);
}

.custom-nav-link.active-page[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.2);
    color: var(--tenant-text-color, white);
    font-weight: 600;
}

.app-sidebar.open .custom-nav-link.active-page[b-o3uwv2jook] {
    border-left: 4px solid rgba(255, 255, 255, 0.6);
}

.custom-nav-link.active-page .custom-nav-icon[b-o3uwv2jook] {
    color: var(--tenant-text-color, white);
    font-weight: 400;
}

.custom-nav-icon[b-o3uwv2jook] {
    transition: all 0.2s ease-in-out;
    font-family: 'Material Icons';
    font-size: 24px;
    user-select: none;
    min-width: 24px;
    text-align: center;
}

.app-sidebar.open .custom-nav-icon[b-o3uwv2jook] {
    margin-right: 12px;
}

.app-sidebar.closed .custom-nav-icon[b-o3uwv2jook] {
    margin-right: 0;
}

.custom-nav-link:hover .custom-nav-icon[b-o3uwv2jook] {
    transform: scale(1.1);
}

/* Hide text when sidebar is closed */
.app-sidebar.closed .nav-text[b-o3uwv2jook] {
    display: none;
}

.nav-text[b-o3uwv2jook] {
    opacity: 1;
    transition: opacity 0.2s ease;
}

/* Sidebar Footer */
.sidebar-footer[b-o3uwv2jook] {
    padding: 8px 4px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-shrink: 0;
    justify-content: flex-end;
}

.user-info[b-o3uwv2jook] {
    display: flex;
    align-items: center;
    padding: 8px;
    gap: 12px;
    color: var(--tenant-text-color, white);
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
}

.app-sidebar.closed .user-info[b-o3uwv2jook] {
    justify-content: center;
    padding: 8px 4px;
}

.user-icon[b-o3uwv2jook] {
    font-size: 24px;
    flex-shrink: 0;
}

.user-name[b-o3uwv2jook] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-sidebar.closed .user-name[b-o3uwv2jook] {
    display: none;
}

.btn-logout[b-o3uwv2jook], .btn-login[b-o3uwv2jook] {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--tenant-text-color, white);
    cursor: pointer;
    padding: 10px;
    text-decoration: none;
    font-size: 14px;
    border-radius: 8px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: center;
}

.app-sidebar.closed .btn-logout[b-o3uwv2jook],
.app-sidebar.closed .btn-login[b-o3uwv2jook] {
    width: 44px;
    height: 44px;
    margin: 0 auto;
    padding: 10px;
}

.btn-logout:hover[b-o3uwv2jook], .btn-login:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.4);
}

.btn-logout .material-icons[b-o3uwv2jook],
.btn-login .material-icons[b-o3uwv2jook] {
    font-size: 22px;
}

.logout-text[b-o3uwv2jook], .login-text[b-o3uwv2jook] {
    transition: opacity 0.2s ease;
}

.app-sidebar.closed .logout-text[b-o3uwv2jook],
.app-sidebar.closed .login-text[b-o3uwv2jook] {
    display: none;
}

/* User Menu Dropdown */
.user-info[b-o3uwv2jook] {
    cursor: pointer;
    user-select: none;
    position: relative;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.user-info:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.08);
}

.menu-arrow[b-o3uwv2jook] {
    margin-left: auto;
    font-size: 20px;
    transition: transform 0.3s ease;
}

.menu-arrow.rotated[b-o3uwv2jook] {
    transform: rotate(180deg);
}

.app-sidebar.closed .menu-arrow[b-o3uwv2jook] {
    display: none;
}

.user-menu[b-o3uwv2jook] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 4px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    padding: 4px;
    animation: slideUp-b-o3uwv2jook 0.2s ease;
}

@keyframes slideDown-b-o3uwv2jook {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideUp-b-o3uwv2jook {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideUpMobile-b-o3uwv2jook {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.user-menu-item[b-o3uwv2jook] {
    background: transparent;
    border: none;
    color: var(--tenant-text-color, white);
    cursor: pointer;
    padding: 10px 12px;
    text-decoration: none;
    font-size: 14px;
    border-radius: 6px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left;
    width: 100%;
}

.user-menu-item:hover[b-o3uwv2jook] {
    background: rgba(255, 255, 255, 0.15);
}

.user-menu-item .material-icons[b-o3uwv2jook] {
    font-size: 20px;
}

.user-menu-item.logout[b-o3uwv2jook] {
    color: #ff6b6b;
}

.user-menu-item.logout:hover[b-o3uwv2jook] {
    background: rgba(255, 107, 107, 0.2);
}

.menu-item-text[b-o3uwv2jook] {
    transition: opacity 0.2s ease;
}

.app-sidebar.closed .user-menu[b-o3uwv2jook] {
    display: none;
}

/* Main Content */
.app-main[b-o3uwv2jook] {
    margin-left: 60px;
    padding: 24px;
    transition: margin-left 0.3s ease;
    max-width: 100%;
    flex: 1;
    overflow-x: hidden;
    width: 100%;
    box-sizing: border-box;
    background-color: #f5f5f5 !important;
}

.app-main.sidebar-open[b-o3uwv2jook] {
    margin-left: 256px;
}

.app-main.sidebar-closed[b-o3uwv2jook] {
    margin-left: 60px;
}

/* Responsive Design */
@media (max-width: 960px) {
    /* Show mobile app bar */
    .mobile-app-bar[b-o3uwv2jook] {
        display: flex;
    }

    /* Sidebar slides in from left, below app bar */
    .app-sidebar[b-o3uwv2jook] {
        transform: translateX(-256px);
        box-shadow: 2px 0 8px rgba(0, 0, 0, 0.3);
        width: 256px !important;
        top: 56px;
        height: calc(100vh - 56px);
        z-index: 999;
    }

    .app-sidebar.open[b-o3uwv2jook] {
        transform: translateX(0);
    }

    .app-sidebar.closed[b-o3uwv2jook] {
        transform: translateX(-256px);
    }

    /* Backdrop starts below app bar */
    .sidebar-backdrop[b-o3uwv2jook] {
        top: 56px;
    }

    /* Adjust main content for app bar */
    .app-main[b-o3uwv2jook] {
        margin-left: 0 !important;
        padding: 16px;
        padding-top: 72px;
    }

    /* Hide lock button on mobile - overlay menu shouldn't be lockable */
    .lock-toggle[b-o3uwv2jook] {
        display: none;
    }

    /* Hide sidebar menu toggle on mobile - use top bar menu button instead */
    .menu-toggle[b-o3uwv2jook] {
        display: none;
    }

    /* Always show text on mobile */
    .app-sidebar .nav-text[b-o3uwv2jook],
    .app-sidebar .user-name[b-o3uwv2jook],
    .app-sidebar .logout-text[b-o3uwv2jook],
    .app-sidebar .login-text[b-o3uwv2jook] {
        opacity: 1 !important;
        width: auto !important;
    }

    .sidebar-header-content.hidden[b-o3uwv2jook] {
        opacity: 1 !important;
        height: auto !important;
        pointer-events: all !important;
    }

    /* Hide sidebar footer on mobile - account dropdown is in top bar */
    .sidebar-footer[b-o3uwv2jook] {
        display: none;
    }
}

/* Error UI */
#blazor-error-ui[b-o3uwv2jook] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss[b-o3uwv2jook] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* Floating Tenant Logo - Bottom Right Corner */
.floating-logo[b-o3uwv2jook] {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 900;
    opacity: 0.65;
    pointer-events: none;
    user-select: none;
    transition: opacity 0.3s ease;
}

.tenant-logo[b-o3uwv2jook] {
    max-width: 150px;
    max-height: 80px;
    display: block;
    object-fit: contain;
}

@media (max-width: 768px) {
    .floating-logo[b-o3uwv2jook] {
        bottom: 16px;
        right: 16px;
        opacity: 0.5;
    }

    .tenant-logo[b-o3uwv2jook] {
        max-width: 100px;
        max-height: 60px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Candidate/CandidateDashboard.razor.rz.scp.css */
/* CandidateDashboard.razor.css - Blazor CSS Isolation */

/* Container Styles */
.container[b-8xsrcmd6cn] {
    padding: 16px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* Paper Component */
.paper[b-8xsrcmd6cn] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 16px;
}

/* Loading State */
.loading-container[b-8xsrcmd6cn] {
    padding: 60px 20px;
    text-align: center;
}

.loading-spinner[b-8xsrcmd6cn] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-8xsrcmd6cn 1s linear infinite;
    margin: 0 auto 16px;
}

@keyframes spin-b-8xsrcmd6cn {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Text Styles */
.text-h4[b-8xsrcmd6cn] {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.text-h6[b-8xsrcmd6cn] {
    font-size: 1.25rem;
    font-weight: 500;
    margin: 0;
}

.text-body1[b-8xsrcmd6cn] {
    font-size: 1rem;
    margin-bottom: 1rem;
}

.text-body2[b-8xsrcmd6cn] {
    font-size: 0.875rem;
    color: #6c757d;
}

.text-center[b-8xsrcmd6cn] {
    text-align: center;
}

.text-secondary[b-8xsrcmd6cn] {
    color: #6c757d;
}

.mt-2[b-8xsrcmd6cn] {
    margin-top: 0.5rem;
}

.mt-4[b-8xsrcmd6cn] {
    margin-top: 1rem;
}

.mb-2[b-8xsrcmd6cn] {
    margin-bottom: 0.5rem;
}

.mb-4[b-8xsrcmd6cn] {
    margin-bottom: 1rem;
}

.mb-6[b-8xsrcmd6cn] {
    margin-bottom: 1.5rem;
}

/* Grid */
.grid[b-8xsrcmd6cn] {
    display: flex;
    flex-wrap: wrap;
    margin: -8px;
}

.grid-item[b-8xsrcmd6cn] {
    padding: 8px;
    box-sizing: border-box;
}

.grid-item-xs-12[b-8xsrcmd6cn] {
    width: 100%;
}

.grid-item-sm-6[b-8xsrcmd6cn] {
    width: 100%;
}

.grid-item-md-4[b-8xsrcmd6cn] {
    width: 100%;
}

@media (min-width: 600px) {
    .grid-item-sm-6[b-8xsrcmd6cn] {
        width: 50%;
    }
}

@media (min-width: 960px) {
    .grid-item-md-4[b-8xsrcmd6cn] {
        width: 33.33333%;
    }
}

/* Card */
.card[b-8xsrcmd6cn] {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s;
}

.card.hover-card:hover[b-8xsrcmd6cn] {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.card-header[b-8xsrcmd6cn] {
    padding: 16px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 1px solid #f0f0f0;
}

.card-header-content h3[b-8xsrcmd6cn] {
    font-size: 1.25rem;
    font-weight: 500;
    margin: 0;
    margin-bottom: 4px;
}

.card-header-content p[b-8xsrcmd6cn] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.card-content[b-8xsrcmd6cn] {
    padding: 16px;
}

.card-actions[b-8xsrcmd6cn] {
    padding: 8px 16px 16px;
    display: flex;
    justify-content: flex-end;
}

/* Status Chip */
.status-chip[b-8xsrcmd6cn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    color: white;
    background-color: #17a2b8;
}

.status-chip.primary[b-8xsrcmd6cn] {
    background-color: #007bff;
}

.status-chip.success[b-8xsrcmd6cn] {
    background-color: #28a745;
}

.status-chip.warning[b-8xsrcmd6cn] {
    background-color: #ffc107;
    color: #212529;
}

.status-chip.error[b-8xsrcmd6cn] {
    background-color: #dc3545;
}

.status-chip.info[b-8xsrcmd6cn] {
    background-color: #17a2b8;
}

.status-chip.secondary[b-8xsrcmd6cn] {
    background-color: #6c757d;
}

.status-chip.small[b-8xsrcmd6cn] {
    font-size: 10px;
    padding: 2px 6px;
}

/* Button */
.btn[b-8xsrcmd6cn] {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn-primary[b-8xsrcmd6cn] {
    background-color: #007bff;
    color: white;
}

.btn-success[b-8xsrcmd6cn] {
    background-color: #28a745;
    color: white;
}

.btn-text[b-8xsrcmd6cn] {
    background-color: transparent;
    color: #495057;
}

.btn-text.success[b-8xsrcmd6cn] {
    color: #28a745;
}

.btn:hover:not(:disabled)[b-8xsrcmd6cn] {
    opacity: 0.9;
}

.btn-primary:hover:not(:disabled)[b-8xsrcmd6cn] {
    background-color: #0069d9;
}

.btn:disabled[b-8xsrcmd6cn] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-full-width[b-8xsrcmd6cn] {
    width: 100%;
}

/* Icon */
.icon[b-8xsrcmd6cn] {
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
}

.icon.small[b-8xsrcmd6cn] {
    width: 18px;
    height: 18px;
}

.icon.large[b-8xsrcmd6cn] {
    width: 36px;
    height: 36px;
}

.icon.primary[b-8xsrcmd6cn] {
    color: #007bff;
}

.icon.secondary[b-8xsrcmd6cn] {
    color: #6c757d;
}

.icon.success[b-8xsrcmd6cn] {
    color: #28a745;
}

.icon.error[b-8xsrcmd6cn] {
    color: #dc3545;
}

/* Application Info Item */
.info-item[b-8xsrcmd6cn] {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.info-item .icon[b-8xsrcmd6cn] {
    margin-right: 8px;
    flex-shrink: 0;
}

.info-stack[b-8xsrcmd6cn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mr-2[b-8xsrcmd6cn] {
    margin-right: 0.5rem;
}

/* Flex utilities */
.d-flex[b-8xsrcmd6cn] {
    display: flex;
}

.align-center[b-8xsrcmd6cn] {
    align-items: center;
}

.pa-6[b-8xsrcmd6cn] {
    padding: 24px;
}

.pa-8[b-8xsrcmd6cn] {
    padding: 32px;
}
/* _content/Hirelab-frontend/Components/Pages/Candidate/DeviceCheck.razor.rz.scp.css */
/* DeviceCheck.razor.css - Modern Redesign */

/* Container Styles */
.interview-container[b-8jsawbhatl] {
    min-height: 100vh;
    padding: 16px 24px;
}

.container[b-8jsawbhatl] {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* Paper Component */
.paper[b-8jsawbhatl] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.pa-4[b-8jsawbhatl] {
    padding: 24px;
}

.pa-6[b-8jsawbhatl] {
    padding: 40px;
}

.pa-8[b-8jsawbhatl] {
    padding: 48px;
}

.pa-md-6[b-8jsawbhatl] {
    padding: 40px;
}

.mb-4[b-8jsawbhatl] {
    margin-bottom: 24px;
}

.mt-4[b-8jsawbhatl] {
    margin-top: 24px;
}

.mt-6[b-8jsawbhatl] {
    margin-top: 24px;
}

.text-center[b-8jsawbhatl] {
    text-align: center;
}

/* Loading State */
.loading-container[b-8jsawbhatl] {
    padding: 60px 20px;
    text-align: center;
}

.loading-spinner[b-8jsawbhatl] {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(102, 126, 234, 0.2);
    border-top: 5px solid #667eea;
    border-radius: 50%;
    animation: spin-b-8jsawbhatl 0.8s linear infinite;
    margin: 0 auto 24px;
}

@keyframes spin-b-8jsawbhatl {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-8jsawbhatl] {
    font-size: 18px;
    font-weight: 600;
    color: #667eea;
    margin: 0;
}

/* Header With Actions */
.header-with-actions[b-8jsawbhatl] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    gap: 24px;
}

.header-text[b-8jsawbhatl] {
    flex: 1;
}

.header-text .text-h4[b-8jsawbhatl],
.header-text .text-body1[b-8jsawbhatl] {
    text-align: left;
}

.header-text .mb-4[b-8jsawbhatl] {
    margin-bottom: 8px;
}

.header-text .text-body1.mb-4[b-8jsawbhatl] {
    margin-bottom: 0;
}

.header-buttons[b-8jsawbhatl] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 4px;
}

.header-buttons .btn-action[b-8jsawbhatl] {
    padding: 10px 24px;
    font-size: 14px;
    min-width: 140px;
}

/* Main Content */
.text-h4[b-8jsawbhatl] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 8px 0;
    text-align: center;
    letter-spacing: -0.5px;
}

.text-h6[b-8jsawbhatl] {
    font-size: 1.125rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0;
    line-height: 1.4;
}

.text-body1[b-8jsawbhatl] {
    font-size: 0.95rem;
    color: #6b7280;
    margin: 0 0 24px 0;
    text-align: center;
    font-weight: 400;
}

.device-check-placeholder .text-body1[b-8jsawbhatl] {
    font-size: 1.25rem;
    color: #4b5563;
    margin: 0;
    font-weight: 500;
}

.text-body2[b-8jsawbhatl] {
    font-size: 1rem;
    color: #6b7280;
    font-weight: 500;
}

.text-secondary[b-8jsawbhatl] {
    color: #9ca3af;
    font-size: 1.05rem;
}

.text-primary[b-8jsawbhatl] {
    color: #667eea;
}

/* Grid System */
.grid[b-8jsawbhatl] {
    display: grid;
    gap: 24px;
    width: 100%;
}

.device-check-grid[b-8jsawbhatl] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

@media (min-width: 768px) {
    .device-check-grid[b-8jsawbhatl] {
        grid-template-columns: repeat(2, 1fr);
    }
}

.grid-item[b-8jsawbhatl] {
    width: 100%;
}

.grid-item-xs-12[b-8jsawbhatl] {
    grid-column: 1 / -1;
}

@media (min-width: 768px) {
    .grid-item-md-6[b-8jsawbhatl] {
        grid-column: span 1;
    }

    .grid-item-md-12[b-8jsawbhatl] {
        grid-column: 1 / -1;
    }
}

/* Device Check Cards */
.device-check-card[b-8jsawbhatl] {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    height: 420px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
}

.device-check-card .stack-row.justify-between[b-8jsawbhatl] {
    height: 56px;
    margin-bottom: 0;
    padding-bottom: 16px;
    border-bottom: 1px solid #f3f4f6;
    align-items: center;
    position: relative;
    z-index: 10;
}

.device-check-card .stack-row.justify-between.mb-4[b-8jsawbhatl] {
    margin-bottom: 0 !important;
}

.device-check-card .text-h6[b-8jsawbhatl] {
    font-size: 1.125rem;
    line-height: 1.4;
}

.stack-row[b-8jsawbhatl] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.justify-between[b-8jsawbhatl] {
    justify-content: space-between;
    width: 100%;
}

.justify-center[b-8jsawbhatl] {
    justify-content: center;
}

/* Device Check Content */
.device-check-content[b-8jsawbhatl] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
    min-height: 0;
}

.device-check-video[b-8jsawbhatl] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    border-radius: 12px;
    border: 2px solid #e5e7eb;
}

.device-check-content .text-center[b-8jsawbhatl] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 8px;
}

.device-check-content .text-center .device-check-video[b-8jsawbhatl] {
    flex: 1;
    width: 100%;
    min-height: 0;
    object-fit: cover;
}

.device-check-content .text-center .text-body2[b-8jsawbhatl] {
    flex-shrink: 0;
}

.device-check-placeholder[b-8jsawbhatl] {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
    border-radius: 12px;
    border: 2px dashed #d1d5db;
    padding: 30px 20px;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    box-sizing: border-box;
}

.device-check-placeholder.recording[b-8jsawbhatl] {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-color: #fbbf24;
    border-style: solid;
    animation: pulse-b-8jsawbhatl 2s ease-in-out infinite;
}

@keyframes pulse-b-8jsawbhatl {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.9; }
}

.device-check-placeholder.processing[b-8jsawbhatl] {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
    border-color: #3b82f6;
    border-style: solid;
}

/* Full Width View (After Recording) */
.device-check-full-width[b-8jsawbhatl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 100%;
}

.device-check-full-width .device-check-video[b-8jsawbhatl] {
    max-width: 100%;
    width: 100%;
    height: 500px;
    object-fit: cover;
}

/* Chip */
.chip[b-8jsawbhatl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
}

.chip.small[b-8jsawbhatl] {
    padding: 6px 12px;
    font-size: 11px;
    height: 24px;
    line-height: 1;
}

.chip.info[b-8jsawbhatl] {
    background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);
}

.chip.success[b-8jsawbhatl] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.chip.warning[b-8jsawbhatl] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
}

.chip.error[b-8jsawbhatl] {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

.chip.primary[b-8jsawbhatl] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.chip.secondary[b-8jsawbhatl] {
    background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%);
}

/* Buttons */
.btn[b-8jsawbhatl] {
    padding: 12px 28px;
    border: 2px solid;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    letter-spacing: 0;
    transition: all 0.2s ease;
    transform: translateY(0);
}

.btn:hover:not(:disabled)[b-8jsawbhatl] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.btn:active:not(:disabled)[b-8jsawbhatl] {
    transform: translateY(0);
}

.btn-primary[b-8jsawbhatl] {
    background: transparent;
    color: #667eea;
    border-color: #667eea;
}

.btn-primary:hover:not(:disabled)[b-8jsawbhatl] {
    background: #667eea;
    color: white;
}

.btn-secondary[b-8jsawbhatl] {
    background: transparent;
    color: #64748b;
    border-color: #64748b;
}

.btn-secondary:hover:not(:disabled)[b-8jsawbhatl] {
    background: #64748b;
    color: white;
}

.btn-success[b-8jsawbhatl] {
    background: transparent;
    color: #10b981;
    border-color: #10b981;
}

.btn-success:hover:not(:disabled)[b-8jsawbhatl] {
    background: #10b981;
    color: white;
}

.btn-outline[b-8jsawbhatl] {
    background: transparent;
    border: 2px solid #d1d5db;
    color: #6b7280;
}

.btn-outline:hover:not(:disabled)[b-8jsawbhatl] {
    background: #f9fafb;
    border-color: #9ca3af;
}

.btn-outline-primary[b-8jsawbhatl] {
    background: transparent;
    border: 2px solid #667eea;
    color: #667eea;
}

.btn-outline-primary:hover:not(:disabled)[b-8jsawbhatl] {
    background: #667eea;
    color: white;
}

.btn-outline-success[b-8jsawbhatl] {
    background: transparent;
    border: 2px solid #10b981;
    color: #10b981;
}

.btn-outline-success:hover:not(:disabled)[b-8jsawbhatl] {
    background: #10b981;
    color: white;
}

.btn:disabled[b-8jsawbhatl] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-large[b-8jsawbhatl] {
    padding: 14px 32px;
    font-size: 15px;
    border-radius: 8px;
    font-weight: 600;
    min-width: 180px;
}

.btn-large:hover:not(:disabled)[b-8jsawbhatl] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

.btn-medium[b-8jsawbhatl] {
    padding: 8px 20px;
    font-size: 13px;
    min-width: 110px;
    height: 36px;
    line-height: 1;
}

.btn-action[b-8jsawbhatl] {
    padding: 14px 32px;
    font-size: 15px;
    border-radius: 8px;
    font-weight: 600;
    min-width: 160px;
}

.btn-small[b-8jsawbhatl] {
    padding: 8px 16px;
    font-size: 13px;
}

/* Stack Layout */
.stack[b-8jsawbhatl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 100%;
}

/* Button Group */
.button-group-center[b-8jsawbhatl] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    padding: 24px;
}

/* Responsive Adjustments */
@media (max-width: 767px) {
    .interview-container[b-8jsawbhatl] {
        padding: 8px;
    }

    .header-with-actions[b-8jsawbhatl] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        margin-bottom: 12px;
    }

    .header-text .text-h4[b-8jsawbhatl],
    .header-text .text-body1[b-8jsawbhatl] {
        text-align: center;
    }

    .header-buttons[b-8jsawbhatl] {
        flex-direction: column;
        gap: 8px;
        margin-top: 0;
        width: 100%;
    }

    .header-buttons .btn-action[b-8jsawbhatl] {
        width: 100%;
        padding: 10px 18px;
        font-size: 14px;
    }

    .text-h4[b-8jsawbhatl] {
        font-size: 1.35rem;
        margin-bottom: 6px !important;
    }

    .text-body1[b-8jsawbhatl] {
        font-size: 0.85rem;
        margin-bottom: 12px;
    }

    .device-check-grid[b-8jsawbhatl] {
        gap: 16px;
        grid-template-columns: 1fr;
    }

    .grid-item[b-8jsawbhatl] {
        grid-column: 1 / -1 !important;
    }

    .device-check-card[b-8jsawbhatl] {
        padding: 20px;
        height: auto;
        min-height: 350px;
    }

    .device-check-content[b-8jsawbhatl] {
        height: auto;
        min-height: 250px;
    }

    .device-check-card .stack-row.justify-between[b-8jsawbhatl] {
        height: auto;
        min-height: 48px;
    }

    .btn-large[b-8jsawbhatl] {
        padding: 12px 28px;
        font-size: 14px;
        min-width: 140px;
    }

    .btn-medium[b-8jsawbhatl] {
        padding: 8px 16px;
        font-size: 12px;
        min-width: 90px;
        height: 32px;
    }

    .paper[b-8jsawbhatl] {
        padding: 12px !important;
    }

    .container[b-8jsawbhatl] {
        padding: 0 4px;
    }

    .device-check-placeholder[b-8jsawbhatl] {
        padding: 30px 16px;
        min-height: 220px;
    }

    .button-group-center[b-8jsawbhatl] {
        flex-direction: column;
        padding: 20px 0;
        gap: 12px;
    }

    .button-group-center .btn-action[b-8jsawbhatl] {
        width: 100%;
        padding: 14px 24px;
        font-size: 15px;
    }

    .device-check-full-width[b-8jsawbhatl] {
        padding: 20px 0;
        min-height: 500px;
    }

    .device-check-full-width .device-check-video[b-8jsawbhatl] {
        width: 100%;
        height: auto;
        min-height: 450px;
        max-height: 70vh;
        aspect-ratio: 16/9;
        object-fit: cover;
    }

    .text-h6[b-8jsawbhatl] {
        font-size: 1rem;
    }

    .chip.small[b-8jsawbhatl] {
        font-size: 10px;
        padding: 4px 8px;
        height: 20px;
    }

    .device-check-content .text-center[b-8jsawbhatl] {
        padding: 0;
    }

    .device-check-content .text-center .device-check-video[b-8jsawbhatl] {
        width: 100%;
        min-height: 250px;
    }
}

/* Additional spacing utilities */
.mt-2[b-8jsawbhatl] {
    margin-top: 8px;
}

.mb-2[b-8jsawbhatl] {
    margin-bottom: 8px;
}
/* _content/Hirelab-frontend/Components/Pages/Candidate/Interview.razor.rz.scp.css */
/* Interview.razor.css - Blazor CSS Isolation */

/* Container Styles */
.container[b-yluozo8j9d] {
    padding: 20px;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

/* Paper Component */
.paper[b-yluozo8j9d] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 16px;
}

/* Header Styles */
.header[b-yluozo8j9d] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (min-width: 768px) {
    .header[b-yluozo8j9d] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.header-title[b-yluozo8j9d] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

/* Status Chip */
.status-chip[b-yluozo8j9d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 14px;
    font-weight: 500;
    color: white;
    background: #007bff;
    margin: 0;
    align-self: flex-start;
}

.status-chip.info[b-yluozo8j9d] {
    background: #17a2b8;
}

.status-chip.success[b-yluozo8j9d] {
    background: #28a745;
}

.status-chip.warning[b-yluozo8j9d] {
    background: #ffc107;
    color: #212529;
}

.status-chip.error[b-yluozo8j9d] {
    background: #dc3545;
}

/* Loading State */
.loading-container[b-yluozo8j9d] {
    padding: 60px 20px;
    text-align: center;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 16px;
}

.loading-spinner[b-yluozo8j9d] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-yluozo8j9d 1s linear infinite;
    margin: 0 auto 16px;
}

@keyframes spin-b-yluozo8j9d {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-yluozo8j9d] {
    font-size: 18px;
    font-weight: 500;
    color: #495057;
    margin: 0;
}

/* Stack */
.stack[b-yluozo8j9d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.stack-row[b-yluozo8j9d] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

/* Button Styles */
.btn[b-yluozo8j9d] {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
}

.btn-primary[b-yluozo8j9d] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-yluozo8j9d] {
    background: #0056b3;
}

.btn-secondary[b-yluozo8j9d] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-yluozo8j9d] {
    background: #5a6268;
}

.btn-success[b-yluozo8j9d] {
    background: #28a745;
    color: white;
}

.btn-success:hover:not(:disabled)[b-yluozo8j9d] {
    background: #218838;
}

.btn-outline[b-yluozo8j9d] {
    background: transparent;
    border: 1px solid #ced4da;
    color: #495057;
}

.btn-outline:hover:not(:disabled)[b-yluozo8j9d] {
    background: #f8f9fa;
}

.btn-small[b-yluozo8j9d] {
    padding: 6px 12px;
    font-size: 12px;
}

.btn-large[b-yluozo8j9d] {
    padding: 14px 32px;
    font-size: 16px;
    font-weight: 600;
    min-width: 200px;
}

.btn:disabled[b-yluozo8j9d] {
    opacity: 0.65;
    cursor: not-allowed;
}

/* Text Styles */
.text-h5[b-yluozo8j9d] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0;
}

.text-h6[b-yluozo8j9d] {
    font-size: 1.125rem;
    font-weight: 500;
    margin: 0;
}

.text-body1[b-yluozo8j9d] {
    font-size: 1rem;
    margin: 0;
}

.text-body2[b-yluozo8j9d] {
    font-size: 0.875rem;
    margin: 0;
}

.text-center[b-yluozo8j9d] {
    text-align: center;
}

.text-error[b-yluozo8j9d] {
    color: #dc3545;
}

.text-success[b-yluozo8j9d] {
    color: #28a745;
}

.text-info[b-yluozo8j9d] {
    color: #17a2b8;
}

.text-secondary[b-yluozo8j9d] {
    color: #6c757d;
}

.text-warning[b-yluozo8j9d] {
    color: #ffc107;
}

/* Progress Bar */
.progress-container[b-yluozo8j9d] {
    margin: 12px 0;
    width: 100%;
}

.progress-bar[b-yluozo8j9d] {
    height: 6px;
    background-color: #e9ecef;
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}

.progress-bar-fill[b-yluozo8j9d] {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background-color: #007bff;
    transition: width 0.3s ease;
}

/* Grid System */
.grid[b-yluozo8j9d] {
    display: flex;
    flex-wrap: wrap;
    margin: -8px;
}

.grid-item[b-yluozo8j9d] {
    padding: 8px;
    box-sizing: border-box;
}

.grid-item-xs-12[b-yluozo8j9d] {
    width: 100%;
}

@media (min-width: 768px) {
    .grid-item-md-6[b-yluozo8j9d] {
        width: 50%;
    }
}

/* Cards */
.card[b-yluozo8j9d] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    height: 100%;
    box-sizing: border-box;
}

/* Video Container */
.video-recording-area[b-yluozo8j9d] {
    width: 100%;
    height: 100%;
}

.video-preview-container[b-yluozo8j9d] {
    background-color: #e3f2fd;
    border-radius: 8px;
    padding: 16px;
    text-align: center;
    position: relative;
}

.answer-recording-container[b-yluozo8j9d] {
    background-color: #fff3e0;
    border-radius: 8px;
    padding: 16px;
    text-align: center;
    position: relative;
}

.video-element[b-yluozo8j9d] {
    width: 100%;
    max-width: 100%;
    border-radius: 8px;
    background-color: #000;
    height: min(350px, 60vh);
    object-fit: cover;
}

.video-blurred[b-yluozo8j9d] {
    filter: blur(15px);
}

.video-controls[b-yluozo8j9d] {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
}

/* Question Content */
.question-content[b-yluozo8j9d], .question-info[b-yluozo8j9d] {
    padding: 16px;
}

/* Answer Container */
.answer-container .grid[b-yluozo8j9d] {
    margin: 0 -8px;
}

/* Spacing Classes */
.mt-1[b-yluozo8j9d] { margin-top: 4px; }
.mt-2[b-yluozo8j9d] { margin-top: 8px; }
.mt-3[b-yluozo8j9d] { margin-top: 16px; }
.mt-4[b-yluozo8j9d] { margin-top: 24px; }

.mb-1[b-yluozo8j9d] { margin-bottom: 4px; }
.mb-2[b-yluozo8j9d] { margin-bottom: 8px; }
.mb-3[b-yluozo8j9d] { margin-bottom: 16px; }
.mb-4[b-yluozo8j9d] { margin-bottom: 24px; }

.pa-4[b-yluozo8j9d] { padding: 16px; }
.pa-6[b-yluozo8j9d] { padding: 24px; }

/* Responsive Adjustments */
@media (max-width: 768px) {
    .container[b-yluozo8j9d] {
        padding: 12px;
    }

    .answer-container .grid-item[b-yluozo8j9d] {
        flex-basis: 100% !important;
        max-width: 100% !important;
    }

    .answer-container[b-yluozo8j9d] {
        padding: 8px;
    }

    .btn-large[b-yluozo8j9d] {
        width: 100%;
        min-width: unset;
        padding: 12px 20px;
    }
}

@media (max-width: 600px) {
    .container[b-yluozo8j9d] {
        padding: 8px;
    }

    .answer-container[b-yluozo8j9d] {
        padding: 4px;
    }

    .question-content[b-yluozo8j9d], .question-info[b-yluozo8j9d] {
        padding: 12px !important;
    }
}

/* Timer Chip */
.timer-chip[b-yluozo8j9d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    border-radius: 16px;
    font-size: 16px;
    font-weight: 500;
    color: white;
    background: #17a2b8;
    margin: 0 auto;
}

.timer-chip.warning[b-yluozo8j9d] {
    background: #ffc107;
    color: #212529;
}

.timer-chip.error[b-yluozo8j9d] {
    background: #dc3545;
}

/* Height Classes */
.h-100[b-yluozo8j9d] {
    height: 100%;
}
/* _content/Hirelab-frontend/Components/Pages/Candidate/InterviewRecording.razor.rz.scp.css */
/* Container styles */
.container[b-h4sk3pbnqk] {
    width: 100%;
    padding: 1.5rem;
}

.container-xxl[b-h4sk3pbnqk] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 1rem;
}

/* Paper/Card styles */
.paper[b-h4sk3pbnqk],
.card[b-h4sk3pbnqk] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    padding: 1rem;
}

/* Stack layouts */
.stack-row[b-h4sk3pbnqk] {
    display: flex;
    flex-direction: row;
    gap: 8px;
}

.stack-center[b-h4sk3pbnqk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.space-between[b-h4sk3pbnqk] {
    justify-content: space-between;
}

.justify-center[b-h4sk3pbnqk] {
    justify-content: center;
}

.align-center[b-h4sk3pbnqk] {
    align-items: center;
}

.spacing-2[b-h4sk3pbnqk] {
    gap: 8px;
}

.spacing-3[b-h4sk3pbnqk] {
    gap: 12px;
}

/* Grid system */
.grid[b-h4sk3pbnqk] {
    display: flex;
    flex-wrap: wrap;
    margin: -8px;
}

.grid-item[b-h4sk3pbnqk] {
    padding: 8px;
}

.col-12[b-h4sk3pbnqk] {
    flex: 0 0 100%;
    max-width: 100%;
}

@media (min-width: 768px) {
    .col-md-6[b-h4sk3pbnqk] {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

/* Typography */
h4[b-h4sk3pbnqk] {
    font-size: 2rem;
    font-weight: 500;
    margin: 0;
}

h5[b-h4sk3pbnqk] {
    font-size: 1.5rem;
    font-weight: 500;
    margin: 0;
}

h6[b-h4sk3pbnqk] {
    font-size: 1.25rem;
    font-weight: 500;
    margin: 0;
}

p[b-h4sk3pbnqk] {
    margin: 0;
}

.small[b-h4sk3pbnqk] {
    font-size: 0.875rem;
}

/* Text colors */
.text-primary[b-h4sk3pbnqk] {
    color: #1976d2;
}

.text-secondary[b-h4sk3pbnqk] {
    color: #666;
}

.text-info[b-h4sk3pbnqk] {
    color: #0288d1;
}

.text-success[b-h4sk3pbnqk] {
    color: #2e7d32;
}

.text-warning[b-h4sk3pbnqk] {
    color: #ed6c02;
}

.text-error[b-h4sk3pbnqk] {
    color: #d32f2f;
}

/* Utility classes */
.text-center[b-h4sk3pbnqk] {
    text-align: center;
}

.mt-2[b-h4sk3pbnqk] {
    margin-top: 0.5rem;
}

.mt-3[b-h4sk3pbnqk] {
    margin-top: 0.75rem;
}

.mt-4[b-h4sk3pbnqk] {
    margin-top: 1rem;
}

.mt-6[b-h4sk3pbnqk] {
    margin-top: 1.5rem;
}

.mb-2[b-h4sk3pbnqk] {
    margin-bottom: 0.5rem;
}

.mb-4[b-h4sk3pbnqk] {
    margin-bottom: 1rem;
}

.mb-6[b-h4sk3pbnqk] {
    margin-bottom: 1.5rem;
}

.pa-4[b-h4sk3pbnqk] {
    padding: 1rem;
}

.pa-6[b-h4sk3pbnqk] {
    padding: 1.5rem;
}

.pa-8[b-h4sk3pbnqk] {
    padding: 2rem;
}

.pa-md-6[b-h4sk3pbnqk] {
    padding: 1.5rem;
}

.h-100[b-h4sk3pbnqk] {
    height: 100%;
}

/* Button styles */
.btn[b-h4sk3pbnqk] {
    display: inline-block;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}

.btn:disabled[b-h4sk3pbnqk] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-primary[b-h4sk3pbnqk] {
    background-color: #1976d2;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-h4sk3pbnqk] {
    background-color: #1565c0;
}

.btn-secondary[b-h4sk3pbnqk] {
    background-color: #9c27b0;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-h4sk3pbnqk] {
    background-color: #7b1fa2;
}

.btn-success[b-h4sk3pbnqk] {
    background-color: #2e7d32;
    color: white;
}

.btn-success:hover:not(:disabled)[b-h4sk3pbnqk] {
    background-color: #1b5e20;
}

.btn-outlined[b-h4sk3pbnqk] {
    background-color: transparent;
    border: 1px solid currentColor;
}

.btn-outlined.btn-primary[b-h4sk3pbnqk] {
    color: #1976d2;
    border-color: #1976d2;
}

.btn-outlined.btn-primary:hover:not(:disabled)[b-h4sk3pbnqk] {
    background-color: rgba(25, 118, 210, 0.08);
}

.btn-outlined.btn-secondary[b-h4sk3pbnqk] {
    color: #9c27b0;
    border-color: #9c27b0;
}

.btn-outlined.btn-secondary:hover:not(:disabled)[b-h4sk3pbnqk] {
    background-color: rgba(156, 39, 176, 0.08);
}

.btn-outlined.btn-success[b-h4sk3pbnqk] {
    color: #2e7d32;
    border-color: #2e7d32;
}

.btn-outlined.btn-success:hover:not(:disabled)[b-h4sk3pbnqk] {
    background-color: rgba(46, 125, 50, 0.08);
}

/* Chip/Badge styles */
.chip[b-h4sk3pbnqk] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 500;
}

.chip-small[b-h4sk3pbnqk] {
    padding: 4px 8px;
    font-size: 12px;
}

.chip-large[b-h4sk3pbnqk] {
    padding: 8px 16px;
    font-size: 14px;
}

.chip-primary[b-h4sk3pbnqk] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.chip-secondary[b-h4sk3pbnqk] {
    background-color: #f3e5f5;
    color: #9c27b0;
}

.chip-info[b-h4sk3pbnqk] {
    background-color: #e1f5fe;
    color: #0288d1;
}

.chip-success[b-h4sk3pbnqk] {
    background-color: #e8f5e9;
    color: #2e7d32;
}

.chip-warning[b-h4sk3pbnqk] {
    background-color: #fff3e0;
    color: #ed6c02;
}

.chip-error[b-h4sk3pbnqk] {
    background-color: #ffebee;
    color: #d32f2f;
}

.chip-default[b-h4sk3pbnqk] {
    background-color: #f5f5f5;
    color: #666;
}

/* Spinner/Loader */
.spinner[b-h4sk3pbnqk] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #1976d2;
    border-radius: 50%;
    animation: spin-b-h4sk3pbnqk 1s linear infinite;
    margin: 0 auto;
}

.spinner-large[b-h4sk3pbnqk] {
    width: 60px;
    height: 60px;
    border-width: 5px;
}

@keyframes spin-b-h4sk3pbnqk {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Progress bar */
.progress-bar[b-h4sk3pbnqk] {
    width: 100%;
    height: 4px;
    background-color: #e0e0e0;
    border-radius: 2px;
    overflow: hidden;
}

.progress-bar-fill[b-h4sk3pbnqk] {
    height: 100%;
    background-color: #1976d2;
    transition: width 0.3s ease;
}

/* Icon styles */
.icon[b-h4sk3pbnqk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.icon-large[b-h4sk3pbnqk] {
    font-size: 3rem;
    width: 64px;
    height: 64px;
}

.icon-success[b-h4sk3pbnqk] {
    background-color: #e8f5e9;
    color: #2e7d32;
}

.icon-warning[b-h4sk3pbnqk] {
    background-color: #fff3e0;
    color: #ed6c02;
}

.icon-error[b-h4sk3pbnqk] {
    background-color: #ffebee;
    color: #d32f2f;
}

/* Interview container */
.interview-container[b-h4sk3pbnqk] {
    min-height: 100vh;
    background-color: #f5f5f5;
}

/* Answer recording layout improvements */
.answer-container .grid[b-h4sk3pbnqk] {
    margin: 0 !important;
    width: 100% !important;
    display: flex;
    flex-wrap: wrap;
}

.answer-container .grid-item[b-h4sk3pbnqk] {
    padding: 8px !important;
    flex-basis: 50% !important;
    max-width: 50% !important;
}

/* Video recording area styling */
.video-recording-area video[b-h4sk3pbnqk] {
    border: 2px solid #e0e0e0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Question info styling */
.question-info[b-h4sk3pbnqk] {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

.question-content[b-h4sk3pbnqk] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Device Check Section - Equal Container Sizes */
.device-check-grid[b-h4sk3pbnqk] {
    margin: 0 !important;
    width: 100% !important;
}

.device-check-grid .grid-item[b-h4sk3pbnqk] {
    padding: 8px !important;
    height: 100% !important;
}

.device-check-card[b-h4sk3pbnqk] {
    height: 500px !important;
    min-height: 500px !important;
    max-height: 500px !important;
    display: flex !important;
    flex-direction: column !important;
}

.device-check-content[b-h4sk3pbnqk] {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    height: 350px !important;
    min-height: 350px !important;
    max-height: 350px !important;
}

.device-check-video[b-h4sk3pbnqk] {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 8px !important;
    background-color: #000 !important;
    height: 350px !important;
    min-height: 350px !important;
    max-height: 350px !important;
    object-fit: cover !important;
    border: 2px solid #e0e0e0 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

.device-check-placeholder[b-h4sk3pbnqk] {
    height: 350px !important;
    min-height: 350px !important;
    max-height: 350px !important;
    background-color: #f5f5f5 !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #e0e0e0 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

.device-check-placeholder.recording[b-h4sk3pbnqk] {
    background-color: #fff3e0 !important;
}

.device-check-placeholder.processing[b-h4sk3pbnqk] {
    background-color: #e3f2fd !important;
}

/* Desktop adjustments */
@media (min-width: 961px) {
    .video-recording-area video[b-h4sk3pbnqk] {
        height: min(400px, 65vh) !important;
    }

    .question-info[b-h4sk3pbnqk] {
        text-align: left;
    }

    .question-info .text-center[b-h4sk3pbnqk] {
        text-align: center !important;
    }
}

/* Large screen adjustments */
@media (min-width: 1200px) {
    .video-recording-area video[b-h4sk3pbnqk] {
        height: min(450px, 70vh) !important;
    }
}

/* Mobile adjustments */
@media (max-width: 960px) {
    .answer-container .grid-item[b-h4sk3pbnqk] {
        padding: 4px !important;
    }

    .video-recording-area video[b-h4sk3pbnqk] {
        height: min(300px, 50vh) !important;
    }

    .question-info[b-h4sk3pbnqk] {
        text-align: center;
        padding-top: 16px;
    }

    .device-check-card[b-h4sk3pbnqk] {
        min-height: 400px !important;
    }

    .device-check-video[b-h4sk3pbnqk] {
        height: 280px !important;
    }

    .device-check-placeholder[b-h4sk3pbnqk] {
        height: 280px !important;
    }

    .device-check-grid .grid-item[b-h4sk3pbnqk] {
        padding: 4px !important;
        margin-bottom: 16px !important;
    }
}

/* Additional responsive adjustments */
@media (max-width: 767px) {
    .stack-row[b-h4sk3pbnqk] {
        flex-direction: column;
    }

    .container-xxl[b-h4sk3pbnqk] {
        padding: 0.5rem;
    }

    h4[b-h4sk3pbnqk] {
        font-size: 1.5rem;
    }

    h5[b-h4sk3pbnqk] {
        font-size: 1.25rem;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Candidate/InterviewRedirect.razor.rz.scp.css */
/* This is a simple redirect component, no custom CSS needed */
/* _content/Hirelab-frontend/Components/Pages/Candidate/InterviewRequirements.razor.rz.scp.css */
/* Interview Requirements Page - Modern Design */

.requirements-page[b-yf3eupmga8] {
    min-height: 100vh;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    overflow-x: hidden; /* Prevent horizontal scroll */
}

.page-container[b-yf3eupmga8] {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    padding: 32px 24px 0 24px;
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh; /* Dynamic viewport height for mobile browsers */
    overflow: hidden;
    box-sizing: border-box; /* Ensure padding is included in width */
}

/* Page Header */
.page-header[b-yf3eupmga8] {
    margin-bottom: 24px;
    flex-shrink: 0;
}

.page-title[b-yf3eupmga8] {
    margin: 0 0 8px 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.5px;
}

.page-subtitle[b-yf3eupmga8] {
    margin: 0;
    font-size: 1rem;
    color: #64748b;
    font-weight: 400;
}

/* Scrollable Content */
.requirements-content[b-yf3eupmga8] {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0 4px 0 0;
    margin-right: -4px;
    margin-bottom: 16px;
    min-height: 0; /* Allow flex item to shrink below content size */
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
}

/* Checklist */
.checklist[b-yf3eupmga8] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px;
}

/* Scrollable checklist when more than 5 items */
.checklist.scrollable[b-yf3eupmga8] {
    max-height: calc(5 * (var(--checklist-item-height, 80px) + 12px)); /* ~5 items height */
    overflow-y: auto;
    padding-right: 8px;
    margin-right: -8px;
    -webkit-overflow-scrolling: touch;
}

/* Clickable Checklist Items */
.checklist-item[b-yf3eupmga8] {
    --checklist-item-height: 80px; /* Approximate height per item */
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 16px;
    background: white;
    border-radius: 12px;
    border: 2px solid #e2e8f0;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    -webkit-tap-highlight-color: transparent; /* Remove tap highlight on mobile */
    touch-action: manipulation; /* Better touch responsiveness */
}

.checklist-item[b-yf3eupmga8]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: var(--tenant-primary-color, #6366f1);
    border-radius: 12px 0 0 12px;
    transition: width 0.2s ease;
}

.checklist-item:hover[b-yf3eupmga8] {
    border-color: var(--tenant-primary-color, #6366f1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.checklist-item:hover[b-yf3eupmga8]::before {
    width: 6px;
}

.checklist-item.checked[b-yf3eupmga8] {
    background: #f0fdf4;
    border-color: #10b981;
}

.checklist-item.checked[b-yf3eupmga8]::before {
    background: #10b981;
}

.checklist-item.checked:hover[b-yf3eupmga8] {
    border-color: #059669;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.15);
}

/* Custom Checkbox */
.checkbox-wrapper[b-yf3eupmga8] {
    flex-shrink: 0;
    padding-top: 2px;
}

.custom-checkbox[b-yf3eupmga8] {
    width: 28px;
    height: 28px;
    border: 2.5px solid #cbd5e1;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    transition: all 0.2s ease;
}

.checklist-item:hover .custom-checkbox[b-yf3eupmga8] {
    border-color: var(--tenant-primary-color, #6366f1);
}

.custom-checkbox.checked[b-yf3eupmga8] {
    background: #10b981;
    border-color: #10b981;
}

.custom-checkbox svg[b-yf3eupmga8] {
    width: 18px;
    height: 18px;
    color: white;
    animation: checkPop-b-yf3eupmga8 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

@keyframes checkPop-b-yf3eupmga8 {
    0% {
        transform: scale(0);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}

/* Checklist Content */
.checklist-content[b-yf3eupmga8] {
    flex: 1;
}

.checklist-header[b-yf3eupmga8] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}

.checklist-text[b-yf3eupmga8] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.4;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.checklist-item.checked .checklist-text[b-yf3eupmga8] {
    color: #065f46;
}

.required-badge[b-yf3eupmga8] {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    background: #dbeafe;
    color: #1e40af;
    font-size: 0.65rem;
    font-weight: 700;
    border-radius: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid #93c5fd;
}

.checklist-item.checked .required-badge[b-yf3eupmga8] {
    background: #d1fae5;
    color: #065f46;
    border-color: #6ee7b7;
}

.checklist-subtext[b-yf3eupmga8] {
    font-size: 0.95rem;
    color: #64748b;
    line-height: 1.5;
}

.checklist-item.checked .checklist-subtext[b-yf3eupmga8] {
    color: #047857;
}

/* Info Box - How It Works */
.info-box[b-yf3eupmga8] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 20px;
    background: #eff6ff;
    border: 2px solid #3b82f6;
    border-radius: 12px;
    margin-bottom: 20px;
    flex-shrink: 0;
}

.info-icon[b-yf3eupmga8] {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: #2563eb;
    margin-top: 2px;
}

.info-icon svg[b-yf3eupmga8] {
    width: 100%;
    height: 100%;
}

.info-content[b-yf3eupmga8] {
    flex: 1;
}

.info-title[b-yf3eupmga8] {
    display: block;
    color: #1e40af;
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.info-text[b-yf3eupmga8] {
    margin: 0 0 8px 0;
    color: #1e3a8a;
    font-size: 0.9rem;
    line-height: 1.6;
}

.info-text:last-child[b-yf3eupmga8] {
    margin-bottom: 0;
}

.info-list[b-yf3eupmga8] {
    margin: 8px 0;
    padding-left: 20px;
    color: #1e3a8a;
    font-size: 0.9rem;
    line-height: 1.8;
}

.info-list li[b-yf3eupmga8] {
    margin-bottom: 6px;
}

.info-list li:last-child[b-yf3eupmga8] {
    margin-bottom: 0;
}

.info-list strong[b-yf3eupmga8] {
    color: #1e40af;
    font-weight: 600;
}

/* Warning Box */
.warning-box[b-yf3eupmga8] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 16px;
    background: #fef3c7;
    border: 2px solid #fbbf24;
    border-radius: 12px;
    margin-bottom: 16px;
}

.warning-icon[b-yf3eupmga8] {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: #d97706;
    margin-top: 2px;
}

.warning-icon svg[b-yf3eupmga8] {
    width: 100%;
    height: 100%;
}

.warning-content[b-yf3eupmga8] {
    flex: 1;
}

.warning-content strong[b-yf3eupmga8] {
    display: block;
    color: #92400e;
    font-size: 0.85rem;
    font-weight: 700;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.warning-content p[b-yf3eupmga8] {
    margin: 0;
    color: #78350f;
    font-size: 0.85rem;
    line-height: 1.5;
}

/* Validation Message */
.validation-message[b-yf3eupmga8] {
    padding: 16px 20px;
    background: #fee2e2;
    border: 2px solid #f87171;
    border-radius: 12px;
    color: #dc2626;
    font-size: 0.95rem;
    font-weight: 600;
    margin-top: 20px;
    text-align: center;
}

/* Fixed Action Buttons */
.page-actions[b-yf3eupmga8] {
    padding: 16px 0;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    flex-shrink: 0;
    border-top: 1px solid #e2e8f0;
    background: white;
    margin-top: auto; /* Push to bottom */
    position: sticky;
    bottom: 0;
    z-index: 10;
}

.btn[b-yf3eupmga8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 140px;
}

.btn:disabled[b-yf3eupmga8] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-secondary[b-yf3eupmga8] {
    background: white;
    color: #64748b;
    border: 2px solid #e2e8f0;
}

.btn-secondary:hover:not(:disabled)[b-yf3eupmga8] {
    background: #f8fafc;
    color: #475569;
    border-color: #cbd5e1;
}

.btn-primary[b-yf3eupmga8] {
    background: var(--tenant-primary-color, #6366f1);
    color: white;
}

.btn-primary:hover:not(:disabled)[b-yf3eupmga8] {
    background: color-mix(in srgb, var(--tenant-primary-color, #6366f1) 90%, black);
}

.loading-spinner-sm[b-yf3eupmga8] {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-yf3eupmga8 1s linear infinite;
}

@keyframes spin-b-yf3eupmga8 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Video Modal */
.video-modal-overlay[b-yf3eupmga8] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 20px;
    animation: fadeIn-b-yf3eupmga8 0.3s ease-out;
}

@keyframes fadeIn-b-yf3eupmga8 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.video-modal-container[b-yf3eupmga8] {
    background: white;
    border-radius: 16px;
    max-width: 650px;
    width: 90%;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    position: relative;
    animation: slideUp-b-yf3eupmga8 0.3s ease-out;
    margin: 20px;
}

@keyframes slideUp-b-yf3eupmga8 {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.video-modal-close[b-yf3eupmga8] {
    position: absolute;
    top: 20px;
    right: 20px;
    background: rgba(0, 0, 0, 0.5);
    color: white;
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    font-size: 1.5rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    z-index: 10;
}

.video-modal-close:hover[b-yf3eupmga8] {
    background: rgba(0, 0, 0, 0.8);
    transform: scale(1.1);
}

.video-modal-content[b-yf3eupmga8] {
    padding: 32px 28px;
}

.video-modal-title[b-yf3eupmga8] {
    margin: 0 0 8px 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    text-align: center;
}

.video-modal-subtitle[b-yf3eupmga8] {
    margin: 0 0 24px 0;
    font-size: 0.95rem;
    color: #6b7280;
    text-align: center;
}

.video-wrapper[b-yf3eupmga8] {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
    border-radius: 12px;
    background: #000;
    margin-bottom: 32px;
}

.video-wrapper iframe[b-yf3eupmga8] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
}

.video-continue-btn[b-yf3eupmga8] {
    width: 100%;
    padding: 14px;
    font-size: 1rem;
    margin-top: 24px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-container[b-yf3eupmga8] {
        padding: 20px 16px 0 16px;
        padding-bottom: 0; /* Buttons will handle their own spacing */
        height: 100vh;
        height: 100dvh; /* Dynamic viewport height for mobile browsers */
    }

    .page-header[b-yf3eupmga8] {
        margin-bottom: 16px;
    }

    .page-title[b-yf3eupmga8] {
        font-size: 1.5rem;
    }

    .page-subtitle[b-yf3eupmga8] {
        font-size: 0.9rem;
    }

    .requirements-content[b-yf3eupmga8] {
        padding: 0 2px 0 0;
        margin-bottom: 12px;
        -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
        flex: 1 1 auto;
        overflow-y: auto;
        min-height: 0;
    }

    .checklist.scrollable[b-yf3eupmga8] {
        max-height: calc(5 * (var(--checklist-item-height, 75px) + 12px)); /* ~5 items height on mobile */
        padding-right: 6px;
        margin-right: -6px;
    }

    .checklist-item[b-yf3eupmga8] {
        padding: 14px;
        gap: 12px;
    }

    .checklist-text[b-yf3eupmga8] {
        font-size: 1rem;
    }

    .checklist-subtext[b-yf3eupmga8] {
        font-size: 0.875rem;
    }

    .info-box[b-yf3eupmga8] {
        padding: 16px;
        gap: 10px;
        margin-bottom: 16px;
    }

    .info-icon[b-yf3eupmga8] {
        width: 22px;
        height: 22px;
    }

    .info-title[b-yf3eupmga8] {
        font-size: 0.85rem;
        margin-bottom: 6px;
    }

    .info-text[b-yf3eupmga8] {
        font-size: 0.85rem;
        line-height: 1.5;
    }

    .info-list[b-yf3eupmga8] {
        font-size: 0.85rem;
        line-height: 1.6;
        padding-left: 18px;
        margin: 6px 0;
    }

    .info-list li[b-yf3eupmga8] {
        margin-bottom: 4px;
    }

    .warning-box[b-yf3eupmga8] {
        padding: 14px;
        gap: 10px;
    }

    .warning-icon[b-yf3eupmga8] {
        width: 22px;
        height: 22px;
    }

    .warning-content strong[b-yf3eupmga8] {
        font-size: 0.8rem;
    }

    .warning-content p[b-yf3eupmga8] {
        font-size: 0.8rem;
    }

    .page-actions[b-yf3eupmga8] {
        padding: 12px 0;
        flex-direction: column;
        gap: 10px;
        position: sticky;
        bottom: 0;
        background: white;
        z-index: 10;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05); /* Subtle shadow to separate from content */
    }

    .btn[b-yf3eupmga8] {
        width: 100%;
        min-width: unset;
        padding: 14px 24px;
        font-size: 0.95rem;
    }

    .video-modal-container[b-yf3eupmga8] {
        margin: 10px;
        border-radius: 12px;
        max-width: 95%;
    }

    .video-modal-content[b-yf3eupmga8] {
        padding: 24px 20px;
    }

    .video-modal-title[b-yf3eupmga8] {
        font-size: 1.25rem;
    }

    .video-modal-subtitle[b-yf3eupmga8] {
        font-size: 0.9rem;
        margin-bottom: 20px;
    }

    .video-modal-close[b-yf3eupmga8] {
        width: 36px;
        height: 36px;
        top: 12px;
        right: 12px;
        font-size: 1.25rem;
    }
}

/* Mobile phones - smaller screens */
@media (max-width: 480px) {
    .page-container[b-yf3eupmga8] {
        padding: 16px 12px 0 12px;
        padding-bottom: 0; /* Buttons will handle their own spacing */
        height: 100vh;
        height: 100dvh;
    }

    .page-header[b-yf3eupmga8] {
        margin-bottom: 12px;
    }

    .page-title[b-yf3eupmga8] {
        font-size: 1.25rem;
        line-height: 1.3;
    }

    .page-subtitle[b-yf3eupmga8] {
        font-size: 0.85rem;
        line-height: 1.4;
    }

    .requirements-content[b-yf3eupmga8] {
        margin-bottom: 12px;
        padding-right: 8px;
        flex: 1 1 auto;
        overflow-y: auto;
        min-height: 0;
    }

    .checklist.scrollable[b-yf3eupmga8] {
        max-height: calc(5 * (var(--checklist-item-height, 70px) + 10px)); /* ~5 items height on small phones */
        padding-right: 4px;
        margin-right: -4px;
    }

    .checklist[b-yf3eupmga8] {
        gap: 10px;
        margin-bottom: 12px;
    }

    .checklist-item[b-yf3eupmga8] {
        padding: 12px;
        gap: 10px;
        border-radius: 10px;
        border-width: 1.5px;
    }

    .checklist-item[b-yf3eupmga8]::before {
        width: 3px;
    }

    .custom-checkbox[b-yf3eupmga8] {
        width: 24px;
        height: 24px;
        border-width: 2px;
        border-radius: 6px;
    }

    .custom-checkbox svg[b-yf3eupmga8] {
        width: 16px;
        height: 16px;
    }

    .checkbox-wrapper[b-yf3eupmga8] {
        padding-top: 1px;
    }

    .checklist-header[b-yf3eupmga8] {
        gap: 8px;
        margin-bottom: 4px;
        flex-wrap: wrap;
    }

    .checklist-text[b-yf3eupmga8] {
        font-size: 0.9rem;
        line-height: 1.4;
        flex: 1;
        min-width: 0; /* Allow text to shrink */
    }

    .required-badge[b-yf3eupmga8] {
        font-size: 0.6rem;
        padding: 3px 8px;
        border-radius: 4px;
        white-space: nowrap;
        flex-shrink: 0;
    }

    .checklist-subtext[b-yf3eupmga8] {
        font-size: 0.8rem;
        line-height: 1.4;
        word-wrap: break-word;
    }

    .info-box[b-yf3eupmga8] {
        padding: 12px;
        gap: 10px;
        border-radius: 10px;
        border-width: 1.5px;
        margin-bottom: 12px;
    }

    .info-icon[b-yf3eupmga8] {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }

    .info-title[b-yf3eupmga8] {
        font-size: 0.75rem;
        margin-bottom: 6px;
    }

    .info-text[b-yf3eupmga8] {
        font-size: 0.8rem;
        line-height: 1.5;
        margin-bottom: 6px;
    }

    .info-list[b-yf3eupmga8] {
        font-size: 0.8rem;
        line-height: 1.6;
        padding-left: 16px;
        margin: 6px 0;
    }

    .info-list li[b-yf3eupmga8] {
        margin-bottom: 4px;
    }

    .warning-box[b-yf3eupmga8] {
        padding: 12px;
        gap: 10px;
        border-radius: 10px;
        border-width: 1.5px;
        margin-bottom: 12px;
    }

    .warning-icon[b-yf3eupmga8] {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }

    .warning-content strong[b-yf3eupmga8] {
        font-size: 0.75rem;
        margin-bottom: 6px;
    }

    .warning-content p[b-yf3eupmga8] {
        font-size: 0.75rem;
        line-height: 1.5;
        word-wrap: break-word;
    }

    .validation-message[b-yf3eupmga8] {
        padding: 12px 16px;
        font-size: 0.85rem;
        border-radius: 10px;
        margin-top: 12px;
    }

    .page-actions[b-yf3eupmga8] {
        padding: 12px 0;
        gap: 8px;
        margin-top: 0;
        position: sticky;
        bottom: 0;
        background: white;
        z-index: 10;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05); /* Subtle shadow to separate from content */
    }

    .btn[b-yf3eupmga8] {
        padding: 12px 20px;
        font-size: 0.9rem;
        border-radius: 10px;
        min-height: 44px; /* Better touch target size */
    }

    .loading-spinner-sm[b-yf3eupmga8] {
        width: 16px;
        height: 16px;
        border-width: 2px;
    }

    /* Video Modal improvements for small phones */
    .video-modal-overlay[b-yf3eupmga8] {
        padding: 0;
    }

    .video-modal-container[b-yf3eupmga8] {
        margin: 0;
        border-radius: 0;
        max-width: 100%;
        width: 100%;
        height: 100vh;
        height: 100dvh;
        display: flex;
        flex-direction: column;
    }

    .video-modal-content[b-yf3eupmga8] {
        padding: 16px;
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .video-modal-title[b-yf3eupmga8] {
        font-size: 1.1rem;
        margin-bottom: 6px;
    }

    .video-modal-subtitle[b-yf3eupmga8] {
        font-size: 0.85rem;
        margin-bottom: 16px;
    }

    .video-wrapper[b-yf3eupmga8] {
        margin-bottom: 16px;
    }

    .video-continue-btn[b-yf3eupmga8] {
        margin-top: 16px;
        padding: 12px;
        font-size: 0.9rem;
    }

    .video-modal-close[b-yf3eupmga8] {
        width: 32px;
        height: 32px;
        top: 8px;
        right: 8px;
        font-size: 1.1rem;
        background: rgba(0, 0, 0, 0.7);
    }
}

/* Extra small phones */
@media (max-width: 360px) {
    .page-container[b-yf3eupmga8] {
        padding: 12px 10px 0 10px;
    }

    .page-title[b-yf3eupmga8] {
        font-size: 1.1rem;
    }

    .page-subtitle[b-yf3eupmga8] {
        font-size: 0.8rem;
    }

    .checklist-item[b-yf3eupmga8] {
        padding: 10px;
    }

    .checklist-text[b-yf3eupmga8] {
        font-size: 0.85rem;
    }

    .checklist-subtext[b-yf3eupmga8] {
        font-size: 0.75rem;
    }

    .warning-box[b-yf3eupmga8] {
        padding: 10px;
    }

    .warning-content strong[b-yf3eupmga8],
    .warning-content p[b-yf3eupmga8] {
        font-size: 0.7rem;
    }

    .btn[b-yf3eupmga8] {
        padding: 12px 16px;
        font-size: 0.85rem;
    }
}
/* _content/Hirelab-frontend/Components/Pages/ChangePassword.razor.rz.scp.css */
.page-container[b-2gmj09lljz] {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 1.5rem;
}

.auth-message[b-2gmj09lljz] {
    background: #fff;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Page Header */
.page-header[b-2gmj09lljz] {
    margin-bottom: 2rem;
}

.header-content[b-2gmj09lljz] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.back-link[b-2gmj09lljz] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: #f8f9fa;
    border: none;
    border-radius: 6px;
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.back-link:hover[b-2gmj09lljz] {
    background: #e9ecef;
    color: #495057;
}

.back-icon[b-2gmj09lljz] {
    width: 1rem;
    height: 1rem;
}

.header-text[b-2gmj09lljz] {
    flex: 1;
}

.page-title[b-2gmj09lljz] {
    font-size: 1.75rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 0.25rem 0;
}

.page-subtitle[b-2gmj09lljz] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

/* Content Card */
.content-wrapper[b-2gmj09lljz] {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.content-card[b-2gmj09lljz] {
    padding: 2rem;
}

/* Progress Steps */
.steps-container[b-2gmj09lljz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.step-item[b-2gmj09lljz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
}

.step-indicator[b-2gmj09lljz] {
    flex-shrink: 0;
}

.step-circle[b-2gmj09lljz] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: #e9ecef;
    color: #6c757d;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.875rem;
    transition: all 0.3s;
}

.step-item.active .step-circle[b-2gmj09lljz] {
    background: #0d6efd;
    color: white;
}

.step-item.completed .step-circle[b-2gmj09lljz] {
    background: #198754;
    color: white;
}

.check-icon[b-2gmj09lljz] {
    width: 1.25rem;
    height: 1.25rem;
}

.step-info[b-2gmj09lljz] {
    flex: 1;
}

.step-title[b-2gmj09lljz] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.125rem;
}

.step-item.active .step-title[b-2gmj09lljz] {
    color: #0d6efd;
}

.step-desc[b-2gmj09lljz] {
    font-size: 0.75rem;
    color: #adb5bd;
}

.step-connector[b-2gmj09lljz] {
    flex: 1;
    height: 2px;
    background: #e9ecef;
    margin: 0 1rem;
    transition: all 0.3s;
}

.step-connector.active[b-2gmj09lljz] {
    background: #198754;
}

.divider[b-2gmj09lljz] {
    height: 1px;
    background: #e9ecef;
    margin: 2rem 0;
}

/* Alerts */
.alert[b-2gmj09lljz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

.alert-error[b-2gmj09lljz] {
    background: #f8d7da;
    color: #842029;
}

.alert-success[b-2gmj09lljz] {
    background: #d1e7dd;
    color: #0f5132;
}

.alert-icon[b-2gmj09lljz] {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

/* Form Container */
.form-container[b-2gmj09lljz] {
    max-width: 500px;
}

.form-section[b-2gmj09lljz] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.section-title[b-2gmj09lljz] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.section-description[b-2gmj09lljz] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: -0.5rem 0 0 0;
}

.section-description strong[b-2gmj09lljz] {
    color: #495057;
    font-weight: 500;
}

/* Form Elements */
.form-group[b-2gmj09lljz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-label[b-2gmj09lljz] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
}

.form-input[b-2gmj09lljz] {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 0.875rem;
    transition: all 0.2s;
}

.form-input:focus[b-2gmj09lljz] {
    outline: none;
    border-color: #0d6efd;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.1);
}

.form-input.input-error[b-2gmj09lljz] {
    border-color: #dc3545;
}

.form-input.input-error:focus[b-2gmj09lljz] {
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

.form-input.input-success[b-2gmj09lljz] {
    border-color: #198754;
}

.form-input.input-success:focus[b-2gmj09lljz] {
    box-shadow: 0 0 0 3px rgba(25, 135, 84, 0.1);
}

.otp-input[b-2gmj09lljz] {
    text-align: center;
    letter-spacing: 0.5rem;
    font-size: 1.25rem;
    font-weight: 600;
}

.form-hint[b-2gmj09lljz] {
    font-size: 0.75rem;
    color: #6c757d;
    margin: 0;
}

.form-error[b-2gmj09lljz] {
    font-size: 0.75rem;
    color: #dc3545;
    margin: 0;
}

.form-success[b-2gmj09lljz] {
    font-size: 0.75rem;
    color: #198754;
    margin: 0;
}

/* Input with Icon */
.input-with-icon[b-2gmj09lljz] {
    position: relative;
}

.input-with-icon .form-input[b-2gmj09lljz] {
    padding-right: 2.5rem;
}

.input-icon-btn[b-2gmj09lljz] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s;
}

.input-icon-btn:hover[b-2gmj09lljz] {
    color: #495057;
}

.input-icon-btn svg[b-2gmj09lljz] {
    width: 1.125rem;
    height: 1.125rem;
}

/* Password Strength */
.password-strength[b-2gmj09lljz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.strength-bar[b-2gmj09lljz] {
    flex: 1;
    height: 0.375rem;
    background: #e9ecef;
    border-radius: 999px;
    overflow: hidden;
}

.strength-fill[b-2gmj09lljz] {
    height: 100%;
    transition: all 0.3s;
    border-radius: 999px;
}

.strength-fill.strength-weak[b-2gmj09lljz] {
    width: 33%;
    background: #dc3545;
}

.strength-fill.strength-medium[b-2gmj09lljz] {
    width: 66%;
    background: #ffc107;
}

.strength-fill.strength-strong[b-2gmj09lljz] {
    width: 100%;
    background: #198754;
}

.strength-label[b-2gmj09lljz] {
    font-size: 0.75rem;
    color: #6c757d;
    white-space: nowrap;
}

/* Requirements */
.requirements[b-2gmj09lljz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.requirement[b-2gmj09lljz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: #6c757d;
}

.requirement.valid[b-2gmj09lljz] {
    color: #198754;
}

.req-icon[b-2gmj09lljz] {
    font-size: 0.875rem;
    font-weight: bold;
}

/* Buttons */
.button-group[b-2gmj09lljz] {
    display: flex;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.btn[b-2gmj09lljz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn:disabled[b-2gmj09lljz] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary[b-2gmj09lljz] {
    background: #0d6efd;
    color: white;
    flex: 1;
}

.btn-primary:hover:not(:disabled)[b-2gmj09lljz] {
    background: #0b5ed7;
}

.btn-secondary[b-2gmj09lljz] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-2gmj09lljz] {
    background: #5c636a;
}

.btn-block[b-2gmj09lljz] {
    width: 100%;
}

.spinner[b-2gmj09lljz] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-2gmj09lljz 0.6s linear infinite;
}

@keyframes spin-b-2gmj09lljz {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 768px) {
    .page-container[b-2gmj09lljz] {
        padding: 1rem;
    }

    .content-card[b-2gmj09lljz] {
        padding: 1.5rem;
    }

    .steps-container[b-2gmj09lljz] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .step-connector[b-2gmj09lljz] {
        width: 2px;
        height: 1.5rem;
        margin: 0 1.25rem;
    }

    .button-group[b-2gmj09lljz] {
        flex-direction: column;
    }

    .btn-primary[b-2gmj09lljz],
    .btn-secondary[b-2gmj09lljz] {
        width: 100%;
    }

    .requirements[b-2gmj09lljz] {
        grid-template-columns: 1fr;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Client/CandidateReview.razor.rz.scp.css */
/* Client CandidateReview.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-x2fwsw8l50] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Loading and Auth States */
.loading-container[b-x2fwsw8l50] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-x2fwsw8l50] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-x2fwsw8l50 1s linear infinite;
}

.loading-text[b-x2fwsw8l50] {
    margin-top: 16px;
    font-size: 1.125rem;
    color: #6c757d;
}

@keyframes spin-b-x2fwsw8l50 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Breadcrumbs */
.breadcrumbs[b-x2fwsw8l50] {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.breadcrumb-item[b-x2fwsw8l50] {
    color: #3b82f6;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.breadcrumb-item:hover[b-x2fwsw8l50] {
    color: #2563eb;
}

.breadcrumb-item.disabled[b-x2fwsw8l50] {
    color: #6c757d;
    cursor: default;
}

.breadcrumb-separator[b-x2fwsw8l50] {
    color: #9ca3af;
    font-weight: 500;
}

/* Main Grid Layout */
.main-grid[b-x2fwsw8l50] {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 24px;
    margin-bottom: 24px;
}

.main-content[b-x2fwsw8l50] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sidebar[b-x2fwsw8l50] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Card Styles */
.candidate-card[b-x2fwsw8l50],
.position-card[b-x2fwsw8l50],
.existing-review-card[b-x2fwsw8l50] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.candidate-card-header[b-x2fwsw8l50],
.position-card-header[b-x2fwsw8l50],
.existing-review-header[b-x2fwsw8l50] {
    background: #f8fafc;
    padding: 20px 24px;
    border-bottom: 1px solid #e2e8f0;
}

.candidate-card-title[b-x2fwsw8l50],
.position-card-title[b-x2fwsw8l50],
.existing-review-title[b-x2fwsw8l50] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0;
}

.existing-review-header[b-x2fwsw8l50] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.candidate-card-content[b-x2fwsw8l50],
.position-card-content[b-x2fwsw8l50],
.existing-review-content[b-x2fwsw8l50] {
    padding: 24px;
}

/* Info Grid */
.candidate-info-grid[b-x2fwsw8l50],
.position-info-grid[b-x2fwsw8l50] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.info-field[b-x2fwsw8l50] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-label[b-x2fwsw8l50] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.info-value[b-x2fwsw8l50] {
    font-size: 1rem;
    color: #1a1a1a;
    font-weight: 500;
}

/* Status badges now use StatusBadge component */

/* Existing Review Styles */
.existing-review-content[b-x2fwsw8l50] {
    padding: 24px;
}

.review-rating[b-x2fwsw8l50] {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
}

.star[b-x2fwsw8l50] {
    font-size: 1.25rem;
    color: #d1d5db;
}

.star.filled[b-x2fwsw8l50] {
    color: #f59e0b;
}

.review-title[b-x2fwsw8l50] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 12px 0;
}

.review-text[b-x2fwsw8l50] {
    color: #374151;
    line-height: 1.6;
    margin: 0 0 16px 0;
    white-space: pre-wrap;
}

.review-meta[b-x2fwsw8l50] {
    display: flex;
    gap: 16px;
    font-size: 0.875rem;
    color: #6c757d;
}

.review-date[b-x2fwsw8l50] {
    font-weight: 500;
}

.review-anonymous[b-x2fwsw8l50] {
    font-style: italic;
}

/* Actions Panel */
.actions-panel[b-x2fwsw8l50] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.actions-panel-header[b-x2fwsw8l50] {
    background: #f8fafc;
    padding: 20px 24px;
    border-bottom: 1px solid #e2e8f0;
}

.actions-panel-title[b-x2fwsw8l50] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0;
}

.actions-panel-content[b-x2fwsw8l50] {
    padding: 24px;
}

.actions-stack[b-x2fwsw8l50] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.action-divider[b-x2fwsw8l50] {
    height: 1px;
    background: #e2e8f0;
    margin: 8px 0;
}

/* Button components now used - styles kept for backwards compatibility if needed */

/* Responsive Design */
@media (max-width: 1024px) {
    .main-grid[b-x2fwsw8l50] {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .sidebar[b-x2fwsw8l50] {
        order: -1;
    }
}

@media (max-width: 768px) {
    .page-container[b-x2fwsw8l50] {
        padding: 16px;
    }

    .candidate-info-grid[b-x2fwsw8l50],
    .position-info-grid[b-x2fwsw8l50] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .candidate-card-content[b-x2fwsw8l50],
    .position-card-content[b-x2fwsw8l50],
    .existing-review-content[b-x2fwsw8l50],
    .actions-panel-content[b-x2fwsw8l50] {
        padding: 20px;
    }

    .candidate-card-header[b-x2fwsw8l50],
    .position-card-header[b-x2fwsw8l50],
    .existing-review-header[b-x2fwsw8l50],
    .actions-panel-header[b-x2fwsw8l50] {
        padding: 16px 20px;
    }

    .existing-review-header[b-x2fwsw8l50] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .review-meta[b-x2fwsw8l50] {
        flex-direction: column;
        gap: 8px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Client/ClientCandidateReview.razor.rz.scp.css */
/* ClientCandidateReview.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-s7e976bzvd] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Loading States */
.loading-container[b-s7e976bzvd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-s7e976bzvd] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-s7e976bzvd 1s linear infinite;
}

.loading-text[b-s7e976bzvd] {
    margin-top: 16px;
    font-size: 1.125rem;
    color: #6c757d;
}

@keyframes spin-b-s7e976bzvd {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Breadcrumbs */
.breadcrumbs[b-s7e976bzvd] {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.breadcrumb-item[b-s7e976bzvd] {
    color: #007bff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.breadcrumb-item:hover[b-s7e976bzvd] {
    text-decoration: underline;
}

.breadcrumb-item.disabled[b-s7e976bzvd] {
    color: #6c757d;
    cursor: default;
}

.breadcrumb-separator[b-s7e976bzvd] {
    color: #6c757d;
    font-size: 14px;
}

/* Main Grid Layout */
.main-grid[b-s7e976bzvd] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr;
}

/* Candidate Header */
.candidate-header[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 32px 24px;
    margin-bottom: 24px;
}

.candidate-name-large[b-s7e976bzvd] {
    font-size: 2rem;
    font-weight: 700;
    color: #212529;
    margin: 0;
    line-height: 1.4;
}

.candidate-position[b-s7e976bzvd] {
    font-size: 1.25rem;
    color: #6c757d;
    font-weight: 400;
    margin-left: 8px;
}

/* Candidate Details Card (legacy - may be used elsewhere) */
.candidate-card[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.candidate-card-header[b-s7e976bzvd] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.candidate-card-title[b-s7e976bzvd] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.candidate-card-content[b-s7e976bzvd] {
    padding: 24px;
}

.candidate-name[b-s7e976bzvd] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    padding: 8px 0;
}

.candidate-info-grid[b-s7e976bzvd] {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.info-field[b-s7e976bzvd] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-label[b-s7e976bzvd] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    font-weight: 600;
}

.info-value[b-s7e976bzvd] {
    font-size: 1rem;
    color: #212529;
    font-weight: 500;
}

/* Status badges now use StatusBadge component */

/* Actions Panel */
.actions-panel[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.actions-panel-header[b-s7e976bzvd] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.actions-panel-title[b-s7e976bzvd] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.actions-panel-content[b-s7e976bzvd] {
    padding: 24px;
}

.actions-stack[b-s7e976bzvd] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.action-divider[b-s7e976bzvd] {
    height: 1px;
    background: #e9ecef;
    margin: 8px 0;
}

/* Action Buttons */
.btn-action[b-s7e976bzvd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-decoration: none;
    white-space: nowrap;
    min-height: 40px;
    width: 100%;
    border: 1px solid;
}

.btn-action .btn-icon[b-s7e976bzvd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-action .btn-icon svg[b-s7e976bzvd] {
    width: 16px;
    height: 16px;
}

.btn-action:disabled[b-s7e976bzvd] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Accept Button - Green */
.accept-btn[b-s7e976bzvd] {
    background-color: transparent;
    color: #16a34a;
    border-color: #16a34a;
}

.accept-btn:hover:not(:disabled)[b-s7e976bzvd] {
    background-color: #16a34a;
    color: white;
}

.accept-btn:focus[b-s7e976bzvd] {
    outline: 2px solid #16a34a;
    outline-offset: 2px;
}

/* Reject Button - Red */
.reject-btn[b-s7e976bzvd] {
    background-color: transparent;
    color: #dc2626;
    border-color: #dc2626;
}

.reject-btn:hover:not(:disabled)[b-s7e976bzvd] {
    background-color: #dc2626;
    color: white;
}

.reject-btn:focus[b-s7e976bzvd] {
    outline: 2px solid #dc2626;
    outline-offset: 2px;
}

/* Uncertain Button - Orange/Yellow */
.uncertain-btn[b-s7e976bzvd] {
    background-color: transparent;
    color: #f59e0b;
    border-color: #f59e0b;
}

.uncertain-btn:hover:not(:disabled)[b-s7e976bzvd] {
    background-color: #f59e0b;
    color: white;
}

.uncertain-btn:focus[b-s7e976bzvd] {
    outline: 2px solid #f59e0b;
    outline-offset: 2px;
}

/* Current Status Display */
.current-status-display[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 16px;
    border: 1px solid #e9ecef;
}

.status-label[b-s7e976bzvd] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Button components now used - minimal styles for backwards compatibility */

/* Interview Videos Section */
.videos-card[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.videos-card-header[b-s7e976bzvd] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.videos-card-title[b-s7e976bzvd] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.videos-card-content[b-s7e976bzvd] {
    padding: 24px;
}

.videos-grid[b-s7e976bzvd] {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.video-container[b-s7e976bzvd] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s ease;
}

.video-container:hover[b-s7e976bzvd] {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.video-info[b-s7e976bzvd] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.video-title[b-s7e976bzvd] {
    font-size: 1rem;
    font-weight: 600;
    color: #007bff;
    margin: 0;
}

.video-wrapper[b-s7e976bzvd] {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    overflow: hidden;
    border-radius: 8px;
    background-color: #000;
}

.interview-video[b-s7e976bzvd] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
    object-fit: cover;
    background-color: #000;
}

/* Interview Responses Section */
.interview-responses-card[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.interview-responses-header[b-s7e976bzvd] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.interview-responses-title[b-s7e976bzvd] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.interview-responses-content[b-s7e976bzvd] {
    padding: 24px;
}

.response-card[b-s7e976bzvd] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
}

.response-question[b-s7e976bzvd] {
    margin-bottom: 20px;
}

.question-header[b-s7e976bzvd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.question-number[b-s7e976bzvd] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.question-type[b-s7e976bzvd] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 4px 12px;
    background: #e3f2fd;
    color: #1976d2;
    border-radius: 12px;
    text-transform: uppercase;
}

.question-text[b-s7e976bzvd] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    line-height: 1.5;
    margin: 0;
}

.response-answer[b-s7e976bzvd] {
    margin-top: 16px;
}

.response-video[b-s7e976bzvd] {
    width: 100%;
    max-height: 500px;
    border-radius: 8px;
    background: #000;
}

.video-meta[b-s7e976bzvd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 12px;
    padding: 8px 12px;
    background: #f8f9fa;
    border-radius: 6px;
    font-size: 0.875rem;
    color: #6c757d;
}

.video-date[b-s7e976bzvd],
.video-duration[b-s7e976bzvd] {
    font-weight: 500;
}

.text-response[b-s7e976bzvd] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
}

.text-response-label[b-s7e976bzvd] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.text-response-content[b-s7e976bzvd] {
    font-size: 1rem;
    color: #212529;
    line-height: 1.6;
    margin: 0;
    white-space: pre-wrap;
}

.response-date[b-s7e976bzvd] {
    margin-top: 12px;
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 500;
}

.no-answer[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 8px;
    color: #856404;
}

.no-answer-icon[b-s7e976bzvd] {
    font-size: 1.5rem;
}

.no-answer-text[b-s7e976bzvd] {
    font-size: 1rem;
    font-weight: 500;
}

.question-navigation[b-s7e976bzvd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background: #f9fafb;
    border-radius: 8px;
    margin-top: 24px;
}

.question-counter[b-s7e976bzvd] {
    font-weight: 600;
    color: #6b7280;
    font-size: 1rem;
}

.no-responses-card[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 48px 24px;
    text-align: center;
}

.no-responses-icon[b-s7e976bzvd] {
    font-size: 3rem;
    margin-bottom: 16px;
}

.no-responses-title[b-s7e976bzvd] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.no-responses-message[b-s7e976bzvd] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

/* Back Button */
.back-button-container[b-s7e976bzvd] {
    margin-top: 24px;
}

/* Responsive Design */
@media (min-width: 992px) {
    .main-grid[b-s7e976bzvd] {
        grid-template-columns: 2fr 1fr;
        gap: 32px;
    }

    .main-content[b-s7e976bzvd] {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    .sidebar[b-s7e976bzvd] {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }
}

@media (max-width: 991px) {
    .main-grid[b-s7e976bzvd] {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (max-width: 767px) {
    .page-container[b-s7e976bzvd] {
        padding: 16px;
    }

    .candidate-info-grid[b-s7e976bzvd] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .videos-grid[b-s7e976bzvd] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .video-wrapper[b-s7e976bzvd] {
        padding-bottom: 75%; /* Adjust aspect ratio for mobile */
    }

    .candidate-card-content[b-s7e976bzvd],
    .videos-card-content[b-s7e976bzvd],
    .questions-card-content[b-s7e976bzvd],
    .actions-panel-content[b-s7e976bzvd] {
        padding: 16px;
    }

    .question-response-card[b-s7e976bzvd] {
        padding: 12px;
    }

    .btn[b-s7e976bzvd] {
        padding: 14px 16px;
        font-size: 16px;
        min-height: 52px;
    }
}

@media (max-width: 479px) {
    .page-container[b-s7e976bzvd] {
        padding: 12px;
    }

    .candidate-card-content[b-s7e976bzvd],
    .videos-card-content[b-s7e976bzvd],
    .questions-card-content[b-s7e976bzvd],
    .actions-panel-content[b-s7e976bzvd] {
        padding: 12px;
    }

    .video-container[b-s7e976bzvd] {
        padding: 12px;
    }

    .video-info[b-s7e976bzvd] {
        gap: 6px;
        margin-bottom: 12px;
    }
}

/* Video List Styles */
.videos-list[b-s7e976bzvd] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.video-list-item[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.video-list-item:hover[b-s7e976bzvd] {
    background: #f3f4f6;
    border-color: #d1d5db;
}

.video-list-info[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
}

.video-list-icon[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #007bff;
    color: white;
    border-radius: 50%;
    flex-shrink: 0;
}

.video-list-details[b-s7e976bzvd] {
    flex: 1;
}

.video-list-title[b-s7e976bzvd] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 8px 0;
}

.video-list-meta[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.video-phase-badge[b-s7e976bzvd] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    background: #dbeafe;
    color: #1e40af;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 400;
}

.video-list-date[b-s7e976bzvd],
.video-list-duration[b-s7e976bzvd] {
    font-size: 0.875rem;
    color: #6b7280;
}

.video-review-indicator[b-s7e976bzvd] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
}

.video-review-indicator.positive[b-s7e976bzvd] {
    background: #d1fae5;
    color: #065f46;
}

.video-review-indicator.negative[b-s7e976bzvd] {
    background: #fee2e2;
    color: #991b1b;
}

.video-review-indicator svg[b-s7e976bzvd] {
    flex-shrink: 0;
}

.video-comment-indicator[b-s7e976bzvd] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.75rem;
    color: #6b7280;
    font-weight: 500;
}

.video-comment-indicator svg[b-s7e976bzvd] {
    flex-shrink: 0;
}

.btn-watch-video[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.btn-watch-video:hover:not(:disabled)[b-s7e976bzvd] {
    background: #0056b3;
    transform: translateX(2px);
}

.btn-watch-video:disabled[b-s7e976bzvd] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Video Modal Styles */
.video-modal-overlay[b-s7e976bzvd] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
    animation: fadeIn-b-s7e976bzvd 0.2s ease;
}

@keyframes fadeIn-b-s7e976bzvd {
    from { opacity: 0; }
    to { opacity: 1; }
}

.video-modal-content[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    width: 100%;
    max-width: 1200px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-s7e976bzvd 0.3s ease;
}

@keyframes slideUp-b-s7e976bzvd {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.video-modal-header[b-s7e976bzvd] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    gap: 16px;
}

.video-modal-navigation[b-s7e976bzvd] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.video-nav-btn[b-s7e976bzvd] {
    background: #10b981;
    border: 1px solid #059669;
    border-radius: 6px;
    padding: 8px 16px;
    cursor: pointer;
    color: white;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 0.875rem;
    font-weight: 500;
}

.video-nav-btn:hover:not(:disabled)[b-s7e976bzvd] {
    background: #059669;
    border-color: #047857;
    color: white;
}

.video-nav-btn:disabled[b-s7e976bzvd] {
    opacity: 0.4;
    cursor: not-allowed;
}

.video-modal-title-section[b-s7e976bzvd] {
    flex: 1;
    min-width: 0;
}

.video-modal-title[b-s7e976bzvd] {
    font-size: 0.9375rem;
    font-weight: 400;
    color: #1f2937;
    margin: 0 0 8px 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
    line-height: 1.4;
    hyphens: auto;
}

.video-modal-meta[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.video-modal-date[b-s7e976bzvd] {
    font-size: 0.875rem;
    color: #6b7280;
}

.video-modal-counter[b-s7e976bzvd] {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 400;
}

.video-modal-close[b-s7e976bzvd] {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: #6b7280;
    border-radius: 4px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    margin-left: 16px;
}

.video-modal-close:hover[b-s7e976bzvd] {
    background: #f3f4f6;
    color: #1f2937;
}

.video-modal-body[b-s7e976bzvd] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.modal-video-player[b-s7e976bzvd] {
    width: 800px;
    height: 450px;
    max-width: 100%;
    background: #000;
    border-radius: 8px;
    object-fit: contain;
    margin: 0 auto;
}

.video-loading-placeholder[b-s7e976bzvd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 800px;
    height: 450px;
    max-width: 100%;
    background: #f8f9fa;
    border-radius: 8px;
    gap: 16px;
    margin: 0 auto;
}

.video-loading-placeholder .loading-spinner[b-s7e976bzvd] {
    width: 48px;
    height: 48px;
    border: 4px solid #e9ecef;
    border-top: 4px solid #007bff;
}

.video-loading-placeholder p[b-s7e976bzvd] {
    margin: 0;
    font-size: 1rem;
    color: #6c757d;
    font-weight: 500;
}

.video-modal-info[b-s7e976bzvd] {
    margin-top: 16px;
    padding: 12px 16px;
    background: #f9fafb;
    border-radius: 6px;
    text-align: center;
    width: 800px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    font-size: 0.875rem;
    color: #6b7280;
}

/* Video Review Section */
.video-review-section[b-s7e976bzvd] {
    margin-top: 24px;
    padding: 24px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    box-sizing: border-box;
    overflow: auto;
    width: 100%;
    align-self: stretch;
}

.review-section-title[b-s7e976bzvd] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 20px 0;
}

/* Thumbs Up/Down Buttons */
.review-rating-buttons[b-s7e976bzvd] {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

.btn-thumb[b-s7e976bzvd] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    background: white;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #6b7280;
    transition: all 0.2s ease;
}

.btn-thumb:hover:not(:disabled)[b-s7e976bzvd] {
    border-color: #d1d5db;
    background: #f9fafb;
}

.btn-thumb:disabled[b-s7e976bzvd] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-thumb.active.positive[b-s7e976bzvd] {
    background: #10b981;
    border-color: #10b981;
    color: white;
}

.btn-thumb.active.negative[b-s7e976bzvd] {
    background: #ef4444;
    border-color: #ef4444;
    color: white;
}

.btn-thumb svg[b-s7e976bzvd] {
    flex-shrink: 0;
}

/* Comment Textarea */
.review-comment-container[b-s7e976bzvd] {
    margin-bottom: 16px;
    width: 100%;
    box-sizing: border-box;
}

.review-comment-textarea[b-s7e976bzvd] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 0.9375rem;
    font-family: inherit;
    line-height: 1.5;
    color: #111827;
    background: white;
    resize: vertical;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.review-comment-textarea:focus[b-s7e976bzvd] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.review-comment-textarea:disabled[b-s7e976bzvd] {
    background: #f3f4f6;
    cursor: not-allowed;
}

.review-comment-container .character-counter[b-s7e976bzvd] {
    margin-top: 6px;
    font-size: 0.75rem;
    color: #9ca3af;
    text-align: right;
}

/* Save Review Button */
.btn-save-review[b-s7e976bzvd] {
    width: 100%;
    padding: 12px 24px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-save-review:hover:not(:disabled)[b-s7e976bzvd] {
    background: #0056b3;
}

.btn-save-review:disabled[b-s7e976bzvd] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Reviews List */
.video-reviews-list[b-s7e976bzvd] {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}

.reviews-list-title[b-s7e976bzvd] {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 16px 0;
}

.review-item[b-s7e976bzvd] {
    background: white;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    margin-bottom: 12px;
}

.review-item:last-child[b-s7e976bzvd] {
    margin-bottom: 0;
}

.review-header[b-s7e976bzvd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.review-author[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.review-author strong[b-s7e976bzvd] {
    font-size: 0.9375rem;
    color: #111827;
}

.review-badge[b-s7e976bzvd] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8125rem;
    font-weight: 500;
}

.review-badge.positive[b-s7e976bzvd] {
    background: #d1fae5;
    color: #065f46;
}

.review-badge.negative[b-s7e976bzvd] {
    background: #fee2e2;
    color: #991b1b;
}

.review-date[b-s7e976bzvd] {
    font-size: 0.8125rem;
    color: #9ca3af;
}

.review-comment[b-s7e976bzvd] {
    margin: 8px 0 0 0;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: #4b5563;
}

/* Empty State */
.empty-state[b-s7e976bzvd] {
    text-align: center;
    padding: 40px 20px;
}

.empty-state-icon[b-s7e976bzvd] {
    font-size: 3rem;
    margin-bottom: 16px;
}

.empty-state-message[b-s7e976bzvd] {
    font-size: 1rem;
    color: #495057;
    margin: 0;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .video-list-item[b-s7e976bzvd] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .video-list-info[b-s7e976bzvd] {
        width: 100%;
    }

    .btn-watch-video[b-s7e976bzvd] {
        width: 100%;
        justify-content: center;
    }

    .video-modal-overlay[b-s7e976bzvd] {
        padding: 0;
    }

    .video-modal-content[b-s7e976bzvd] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }

    .video-modal-header[b-s7e976bzvd] {
        padding: 16px;
        gap: 12px;
    }

    .video-modal-navigation[b-s7e976bzvd] {
        gap: 6px;
    }

    .video-nav-btn[b-s7e976bzvd] {
        padding: 6px 10px;
    }

    .video-modal-title[b-s7e976bzvd] {
        font-size: 1rem;
        line-height: 1.5;
    }

    .video-modal-title-section[b-s7e976bzvd] {
        min-width: 0;
        overflow: hidden;
    }

    .video-modal-body[b-s7e976bzvd] {
        padding: 16px;
    }

    .modal-video-player[b-s7e976bzvd] {
        width: 100%;
        height: auto;
        max-height: 50vh;
    }

    .video-loading-placeholder[b-s7e976bzvd] {
        width: 100%;
        height: auto;
        min-height: 300px;
    }

    .review-rating-buttons[b-s7e976bzvd] {
        flex-direction: column;
    }

    .btn-thumb[b-s7e976bzvd] {
        width: 100%;
    }

    .review-header[b-s7e976bzvd] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .video-review-section[b-s7e976bzvd] {
        padding: 16px;
    }
}

/* Notes Panel Styles */
.notes-panel[b-s7e976bzvd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    margin-top: 24px;
}

.notes-panel-header[b-s7e976bzvd] {
    padding: 18px 24px;
    background: linear-gradient(to bottom, #f8f9fa, #ffffff);
    border-bottom: 2px solid #e9ecef;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notes-panel-title[b-s7e976bzvd] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.notes-subtitle[b-s7e976bzvd] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6366f1;
    background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%);
    padding: 5px 12px;
    border-radius: 14px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    border: 1px solid #c7d2fe;
}

.notes-panel-content[b-s7e976bzvd] {
    padding: 24px;
    background: #fafbfc;
}

.notes-textarea[b-s7e976bzvd] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    font-size: 14px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    line-height: 1.6;
    resize: vertical;
    transition: all 0.2s ease;
    min-height: 120px;
    background: white;
    color: #1e293b;
    box-sizing: border-box;
}

.notes-textarea:hover[b-s7e976bzvd] {
    border-color: #cbd5e1;
}

.notes-textarea:focus[b-s7e976bzvd] {
    outline: none;
    border-color: #6366f1;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1);
    background: white;
}

.notes-textarea[b-s7e976bzvd]::placeholder {
    color: #94a3b8;
    font-style: italic;
}

.notes-footer[b-s7e976bzvd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
    gap: 12px;
}

.character-counter[b-s7e976bzvd] {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
    font-family: 'Courier New', monospace;
    background: white;
    padding: 6px 12px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.btn-sm[b-s7e976bzvd] {
    padding: 10px 24px;
    font-size: 14px;
    min-height: 40px;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(99, 102, 241, 0.2);
}

.btn-sm:hover:not(:disabled)[b-s7e976bzvd] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(99, 102, 241, 0.3);
}

.btn-sm:active:not(:disabled)[b-s7e976bzvd] {
    transform: translateY(0);
}

.btn-sm:disabled[b-s7e976bzvd] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary[b-s7e976bzvd] {
    background-color: #007bff;
    color: white;
    border: none;
}

.btn-primary:hover:not(:disabled)[b-s7e976bzvd] {
    background-color: #0056b3;
}

.client-feedback-content[b-s7e976bzvd] {
    font-size: 0.9375rem;
    color: #1e293b;
}
/* _content/Hirelab-frontend/Components/Pages/Client/ClientDashboard.razor.rz.scp.css */
/* ClientDashboard.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-ywjsp6bzxv] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Page Header */
.page-header[b-ywjsp6bzxv] {
    margin-bottom: 32px;
}

.page-title[b-ywjsp6bzxv] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

/* Access Denied State */
.access-denied[b-ywjsp6bzxv] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
}

.access-denied-card[b-ywjsp6bzxv] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    padding: 48px;
    text-align: center;
    max-width: 400px;
    width: 100%;
}

.access-denied-icon[b-ywjsp6bzxv] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 24px;
}

.access-denied-title[b-ywjsp6bzxv] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

.access-denied-message[b-ywjsp6bzxv] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0 0 32px 0;
    line-height: 1.5;
}

/* Dashboard Grid */
.dashboard-grid[b-ywjsp6bzxv] {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    margin-bottom: 32px;
}

.dashboard-grid.four-columns[b-ywjsp6bzxv] {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.dashboard-grid.two-columns[b-ywjsp6bzxv] {
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
}

/* Stats Cards */
.stat-card[b-ywjsp6bzxv] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 24px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.stat-card:hover[b-ywjsp6bzxv] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.stat-card-content[b-ywjsp6bzxv] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.stat-card-icon[b-ywjsp6bzxv] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 600;
    flex-shrink: 0;
}

.stat-card-icon.primary[b-ywjsp6bzxv] {
    background: #e3f2fd;
    color: #1976d2;
}

.stat-card-icon.success[b-ywjsp6bzxv] {
    background: #e8f5e8;
    color: #2e7d32;
}

.stat-card-icon.warning[b-ywjsp6bzxv] {
    background: #fff3e0;
    color: #f57c00;
}

.stat-card-icon.info[b-ywjsp6bzxv] {
    background: #e1f5fe;
    color: #0288d1;
}

.stat-card-info[b-ywjsp6bzxv] {
    flex: 1;
    min-width: 0;
}

.stat-card-label[b-ywjsp6bzxv] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0 0 4px 0;
    font-weight: 500;
}

.stat-card-value[b-ywjsp6bzxv] {
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
}

.stat-card-value.primary[b-ywjsp6bzxv] {
    color: #1976d2;
}

.stat-card-value.success[b-ywjsp6bzxv] {
    color: #2e7d32;
}

.stat-card-value.warning[b-ywjsp6bzxv] {
    color: #f57c00;
}

.stat-card-value.info[b-ywjsp6bzxv] {
    color: #0288d1;
}

/* Management Cards */
.management-card[b-ywjsp6bzxv] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.management-card-header[b-ywjsp6bzxv] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.management-card-title[b-ywjsp6bzxv] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.management-card-content[b-ywjsp6bzxv] {
    padding: 24px;
}

/* Action Buttons Grid */
.actions-grid[b-ywjsp6bzxv] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, 1fr);
}

/* Buttons */
.btn[b-ywjsp6bzxv] {
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 48px;
    width: 100%;
    margin-bottom: 12px;
}

.btn-filled[b-ywjsp6bzxv] {
    color: white;
}

.btn-primary.btn-filled[b-ywjsp6bzxv] {
    background: #007bff;
}

.btn-primary.btn-filled:hover[b-ywjsp6bzxv] {
    background: #0056b3;
}

.btn-secondary.btn-filled[b-ywjsp6bzxv] {
    background: #6c757d;
}

.btn-secondary.btn-filled:hover[b-ywjsp6bzxv] {
    background: #545b62;
}

/* Override tenant theme - use fixed semantic colors */
.btn-success.btn-filled[b-ywjsp6bzxv] {
    background: #28a745 !important;
}

.btn-success.btn-filled:hover[b-ywjsp6bzxv] {
    background: #1e7e34 !important;
}

.btn-warning.btn-filled[b-ywjsp6bzxv] {
    background: #ffc107 !important;
    color: #212529 !important;
}

.btn-warning.btn-filled:hover[b-ywjsp6bzxv] {
    background: #e0a800 !important;
}

.btn-icon[b-ywjsp6bzxv] {
    font-size: 1.125rem;
}

/* Recent Applications Card */
.applications-card[b-ywjsp6bzxv] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.applications-card-header[b-ywjsp6bzxv] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.applications-card-title[b-ywjsp6bzxv] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.applications-card-content[b-ywjsp6bzxv] {
    padding: 24px;
}

/* Application List */
.application-list[b-ywjsp6bzxv] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.application-item[b-ywjsp6bzxv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #f8f9fa;
}

.application-item:last-child[b-ywjsp6bzxv] {
    border-bottom: none;
}

.application-info[b-ywjsp6bzxv] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.application-name[b-ywjsp6bzxv] {
    font-size: 1rem;
    font-weight: 500;
    color: #212529;
    margin: 0;
}

.application-position[b-ywjsp6bzxv] {
    font-size: 0.75rem;
    color: #6c757d;
    margin: 0;
}

/* Status Badges */
.status-badge[b-ywjsp6bzxv] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    display: inline-block;
}

.status-badge.new[b-ywjsp6bzxv] {
    background: #d4edda;
    color: #155724;
}

.status-badge.review[b-ywjsp6bzxv] {
    background: #fff3cd;
    color: #856404;
}

.status-badge.shortlisted[b-ywjsp6bzxv] {
    background: #d1ecf1;
    color: #0c5460;
}

.status-badge.active[b-ywjsp6bzxv] {
    background: #d4edda;
    color: #155724;
}

.status-badge.reviewing[b-ywjsp6bzxv] {
    background: #fff3cd;
    color: #856404;
}

.status-badge.closed[b-ywjsp6bzxv] {
    background: #f8d7da;
    color: #721c24;
}

/* Positions Table */
.positions-card[b-ywjsp6bzxv] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    grid-column: 1 / -1;
}

.positions-card-header[b-ywjsp6bzxv] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.positions-card-title[b-ywjsp6bzxv] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.positions-card-content[b-ywjsp6bzxv] {
    padding: 24px;
}

.data-table[b-ywjsp6bzxv] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.data-table th[b-ywjsp6bzxv] {
    text-align: left;
    padding: 12px 16px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #e9ecef;
    background: #f8f9fa;
}

.data-table td[b-ywjsp6bzxv] {
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

.data-table tr:hover[b-ywjsp6bzxv] {
    background: #f8f9fa;
}

.table-actions[b-ywjsp6bzxv] {
    display: flex;
    gap: 8px;
}

.btn-icon-only[b-ywjsp6bzxv] {
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 16px;
}

.btn-icon-only.primary[b-ywjsp6bzxv] {
    background: #007bff;
    color: white;
}

.btn-icon-only.primary:hover[b-ywjsp6bzxv] {
    background: #0056b3;
}

.btn-icon-only.secondary[b-ywjsp6bzxv] {
    background: #6c757d;
    color: white;
}

.btn-icon-only.secondary:hover[b-ywjsp6bzxv] {
    background: #545b62;
}

/* Responsive Design */
@media (max-width: 1199px) {
    .actions-grid[b-ywjsp6bzxv] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .page-container[b-ywjsp6bzxv] {
        padding: 16px;
    }

    .page-title[b-ywjsp6bzxv] {
        font-size: 1.5rem;
    }

    .dashboard-grid[b-ywjsp6bzxv] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .dashboard-grid.four-columns[b-ywjsp6bzxv],
    .dashboard-grid.two-columns[b-ywjsp6bzxv] {
        grid-template-columns: 1fr;
    }

    .stat-card[b-ywjsp6bzxv] {
        padding: 20px;
    }

    .stat-card-content[b-ywjsp6bzxv] {
        gap: 12px;
    }

    .stat-card-icon[b-ywjsp6bzxv] {
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }

    .stat-card-value[b-ywjsp6bzxv] {
        font-size: 1.75rem;
    }

    .management-card-content[b-ywjsp6bzxv],
    .applications-card-content[b-ywjsp6bzxv],
    .positions-card-content[b-ywjsp6bzxv] {
        padding: 20px;
    }

    .actions-grid[b-ywjsp6bzxv] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .btn[b-ywjsp6bzxv] {
        padding: 14px 16px;
        font-size: 16px;
        min-height: 52px;
    }

    .access-denied-card[b-ywjsp6bzxv] {
        padding: 32px 24px;
    }

    .access-denied-icon[b-ywjsp6bzxv] {
        font-size: 3rem;
        margin-bottom: 20px;
    }

    .access-denied-title[b-ywjsp6bzxv] {
        font-size: 1.25rem;
    }

    /* Mobile table - stack content */
    .data-table[b-ywjsp6bzxv] {
        font-size: 12px;
    }

    .data-table th[b-ywjsp6bzxv],
    .data-table td[b-ywjsp6bzxv] {
        padding: 8px 12px;
    }

    .table-actions[b-ywjsp6bzxv] {
        flex-direction: column;
        gap: 4px;
    }

    .btn-icon-only[b-ywjsp6bzxv] {
        width: 28px;
        height: 28px;
        font-size: 14px;
    }
}

@media (max-width: 479px) {
    .page-container[b-ywjsp6bzxv] {
        padding: 12px;
    }

    .stat-card[b-ywjsp6bzxv] {
        padding: 16px;
    }

    .stat-card-content[b-ywjsp6bzxv] {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }

    .management-card-content[b-ywjsp6bzxv],
    .applications-card-content[b-ywjsp6bzxv],
    .positions-card-content[b-ywjsp6bzxv] {
        padding: 16px;
    }

    .access-denied-card[b-ywjsp6bzxv] {
        padding: 24px 16px;
    }

    /* Very small screens - hide some table columns */
    .data-table th:nth-child(n+4)[b-ywjsp6bzxv],
    .data-table td:nth-child(n+4)[b-ywjsp6bzxv] {
        display: none;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Client/MyPositions.razor.rz.scp.css */
/* MyPositions.razor.css - Blazor CSS Isolation */

/* Main Container */
.main-container[b-bowmffz3a2] {
    max-width: 80rem;
    margin: 0 auto;
    padding: 0 1rem;
}

/* Page Header */
.page-header[b-bowmffz3a2] {
    margin-bottom: 1rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
}

/* Stats Cards Grid */
.stats-grid[b-bowmffz3a2] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.stats-card[b-bowmffz3a2] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    padding: 1.5rem;
    border: 1px solid #e5e7eb;
}

.stats-content[b-bowmffz3a2] {
    display: flex;
    align-items: center;
}

.stats-label[b-bowmffz3a2] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #6b7280;
    margin-bottom: 0.25rem;
}

.stats-value[b-bowmffz3a2] {
    font-size: 1.5rem;
    font-weight: 700;
}

.stats-value-blue[b-bowmffz3a2] {
    color: #2563eb;
}

.stats-value-green[b-bowmffz3a2] {
    color: #16a34a;
}

.stats-value-purple[b-bowmffz3a2] {
    color: #7c3aed;
}

.stats-value-yellow[b-bowmffz3a2] {
    color: #ca8a04;
}

/* Action Bar */
.action-bar[b-bowmffz3a2] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    padding: 1rem;
    margin-bottom: 1.5rem;
    border: 1px solid #e5e7eb;
}

.action-bar-content[b-bowmffz3a2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Search Input */
.search-container[b-bowmffz3a2] {
    position: relative;
    flex: 1;
    max-width: 28rem;
}

.search-icon[b-bowmffz3a2] {
    position: absolute;
    top: 50%;
    left: 0.75rem;
    transform: translateY(-50%);
    height: 1.25rem;
    width: 1.25rem;
    color: #9ca3af;
    pointer-events: none;
}

.search-input[b-bowmffz3a2] {
    display: block;
    width: 100%;
    padding-left: 2.5rem;
    padding-right: 0.75rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    background-color: white;
    font-size: 0.875rem;
    transition: all 0.15s ease-in-out;
}

.search-input:focus[b-bowmffz3a2] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 1px #3b82f6;
}

.search-input[b-bowmffz3a2]::placeholder {
    color: #9ca3af;
}

.search-input:focus[b-bowmffz3a2]::placeholder {
    color: #6b7280;
}

/* Filter Controls */
.filter-controls[b-bowmffz3a2] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.filter-select[b-bowmffz3a2] {
    display: block;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    background-color: white;
    font-size: 0.875rem;
    min-width: 10rem;
    transition: all 0.15s ease-in-out;
}

.filter-select:focus[b-bowmffz3a2] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 1px #3b82f6;
}

.refresh-button[b-bowmffz3a2] {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 0.375rem;
    color: #374151;
    background-color: white;
    transition: all 0.15s ease-in-out;
}

.refresh-button:hover[b-bowmffz3a2] {
    background-color: #f9fafb;
}

.refresh-button:focus[b-bowmffz3a2] {
    outline: none;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5);
}

/* Positions Table Card */
.positions-card[b-bowmffz3a2] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    border: 1px solid #e5e7eb;
}

.positions-header[b-bowmffz3a2] {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.positions-title[b-bowmffz3a2] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
}

/* Loading Spinner */
.loading-container[b-bowmffz3a2] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem 0;
}

.loading-spinner[b-bowmffz3a2] {
    animation: spin-b-bowmffz3a2 1s linear infinite;
    border-radius: 50%;
    height: 2rem;
    width: 2rem;
    border-bottom: 2px solid #2563eb;
}

@keyframes spin-b-bowmffz3a2 {
    to {
        transform: rotate(360deg);
    }
}

/* Table Styles */
.table-container[b-bowmffz3a2] {
    overflow-x: auto;
}

/* Data Table - Clean grid with borders and spacing */
.data-table[b-bowmffz3a2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    border: 1px solid #e9ecef;
    background: white;
}

.data-table th[b-bowmffz3a2] {
    text-align: left;
    padding: 12px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    background: #f8f9fa;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.data-table th:last-child[b-bowmffz3a2] {
    border-right: none;
}

.data-table th:hover[b-bowmffz3a2] {
    background: #e9ecef;
}

.data-table th.text-center[b-bowmffz3a2] {
    text-align: center;
}

.data-table td[b-bowmffz3a2] {
    padding: 12px;
    border-bottom: 1px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    vertical-align: middle;
}

.data-table td:last-child[b-bowmffz3a2] {
    border-right: none;
}

.data-table tr:hover[b-bowmffz3a2] {
    background: #f8f9fa;
}

.data-table tbody tr:last-child td[b-bowmffz3a2] {
    border-bottom: none;
}

.table[b-bowmffz3a2] {
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.table-header[b-bowmffz3a2] {
    background-color: #f9fafb;
}

.table-header-row[b-bowmffz3a2] {
    border-bottom: 1px solid #e5e7eb;
}

.table-header-cell[b-bowmffz3a2] {
    padding: 0.75rem 1.5rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
}

.table-header-cell:hover[b-bowmffz3a2] {
    background-color: #f3f4f6;
}

.table-header-cell-center[b-bowmffz3a2] {
    text-align: center;
}

.table-body[b-bowmffz3a2] {
    background-color: white;
    border-bottom: 1px solid #e5e7eb;
}

.table-body-row[b-bowmffz3a2] {
    transition: background-color 0.15s ease-in-out;
}

.table-body-row:hover[b-bowmffz3a2] {
    background-color: #f9fafb;
}

.table-cell[b-bowmffz3a2] {
    padding: 1rem 1.5rem;
    white-space: nowrap;
    font-size: 0.875rem;
    color: #111827;
}

.table-cell-center[b-bowmffz3a2] {
    text-align: center;
}

.table-link[b-bowmffz3a2] {
    color: #2563eb;
    font-weight: 500;
    transition: color 0.15s ease-in-out;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer;
    text-decoration: none;
    text-align: left;
    font-size: inherit;
    font-family: inherit;
    line-height: inherit;
    box-shadow: none !important;
    outline: none !important;
    display: inline;
}

.table-link:hover[b-bowmffz3a2] {
    color: #1e40af;
    text-decoration: underline;
    background: none !important;
    border: none !important;
}

.table-link:focus[b-bowmffz3a2] {
    outline: none !important;
    box-shadow: none !important;
}

/* Application Count Badge */
.application-count-badge[b-bowmffz3a2] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
    background-color: #dbeafe;
    color: #1e40af;
}

/* Status Badges */
.status-badge[b-bowmffz3a2] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.status-active[b-bowmffz3a2] {
    background-color: #dcfce7;
    color: #166534;
}

.status-reviewing[b-bowmffz3a2] {
    background-color: #fef3c7;
    color: #92400e;
}

.status-filled[b-bowmffz3a2] {
    background-color: #dbeafe;
    color: #1e40af;
}

.status-closed[b-bowmffz3a2] {
    background-color: #fee2e2;
    color: #991b1b;
}

.status-draft[b-bowmffz3a2] {
    background-color: #f3f4f6;
    color: #374151;
}

/* Action Buttons */
.action-button[b-bowmffz3a2] {
    color: #2563eb;
    font-weight: 500;
    transition: color 0.15s ease-in-out;
}

.action-button:hover[b-bowmffz3a2] {
    color: #1e40af;
}

/* Empty State */
.empty-state[b-bowmffz3a2] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    padding: 2rem;
    text-align: center;
    margin-top: 1.5rem;
    border: 1px solid #e5e7eb;
}

.empty-state-title[b-bowmffz3a2] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
    margin-top: 1rem;
}

.empty-state-message[b-bowmffz3a2] {
    color: #6b7280;
    margin-top: 0.5rem;
}

/* Sort Indicators */
.sort-indicator[b-bowmffz3a2] {
    margin-left: 0.25rem;
}

/* Responsive Design */
@media (min-width: 640px) {
    .stats-grid[b-bowmffz3a2] {
        grid-template-columns: repeat(2, 1fr);
    }

    .action-bar-content[b-bowmffz3a2] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

@media (min-width: 1024px) {
    .stats-grid[b-bowmffz3a2] {
        grid-template-columns: repeat(4, 1fr);
    }
}
/* _content/Hirelab-frontend/Components/Pages/Client/PositionCandidates.razor.rz.scp.css */
/* PositionCandidates.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-wwc3kpvjqb] {
    padding: 24px;
    max-width: 1600px;
    margin: 0 auto;
}

/* Loading State */
.loading-container[b-wwc3kpvjqb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.loading-spinner[b-wwc3kpvjqb] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-wwc3kpvjqb 1s linear infinite;
}

.loading-text[b-wwc3kpvjqb] {
    margin-top: 16px;
    font-size: 14px;
    color: #6c757d;
}

@keyframes spin-b-wwc3kpvjqb {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Access Denied Section */
.access-denied[b-wwc3kpvjqb] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
}

.access-denied-card[b-wwc3kpvjqb] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 40px;
    text-align: center;
    max-width: 400px;
}

.access-denied-icon[b-wwc3kpvjqb] {
    font-size: 48px;
    margin-bottom: 16px;
}

.access-denied-title[b-wwc3kpvjqb] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.access-denied-message[b-wwc3kpvjqb] {
    font-size: 14px;
    color: #6c757d;
    margin: 0 0 24px 0;
}

/* Position Header */
.position-header[b-wwc3kpvjqb] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
    padding: 24px;
}

.position-header-content[b-wwc3kpvjqb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
}

.position-info h1[b-wwc3kpvjqb] {
    margin: 0 0 8px 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: #212529;
}

.position-meta[b-wwc3kpvjqb] {
    margin: 0 0 12px 0;
    font-size: 14px;
    color: #6c757d;
}

.position-description[b-wwc3kpvjqb] {
    margin: 0;
    font-size: 14px;
    color: #495057;
    line-height: 1.5;
}

.position-actions[b-wwc3kpvjqb] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Breadcrumb */
.breadcrumb-nav[b-wwc3kpvjqb] {
    margin-bottom: 1.5rem;
}

.breadcrumb-list[b-wwc3kpvjqb] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.breadcrumb-item[b-wwc3kpvjqb] {
    display: inline-flex;
    align-items: center;
}

.breadcrumb-link[b-wwc3kpvjqb] {
    display: inline-flex;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    transition: color 0.15s ease-in-out;
}

.breadcrumb-link:hover[b-wwc3kpvjqb] {
    color: #2563eb;
}

.breadcrumb-icon[b-wwc3kpvjqb] {
    width: 1rem;
    height: 1rem;
    margin-right: 0.5rem;
}

.breadcrumb-separator[b-wwc3kpvjqb] {
    width: 1.5rem;
    height: 1.5rem;
    color: #9ca3af;
}

.breadcrumb-current[b-wwc3kpvjqb] {
    margin-left: 0.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #6b7280;
}

/* Grid Layout */
.grid-container[b-wwc3kpvjqb] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

/* Position Header Card */
.position-header-card[b-wwc3kpvjqb] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    border: 1px solid #e5e7eb;
}

.position-header-content[b-wwc3kpvjqb] {
    padding: 1.5rem;
}

.position-header-main[b-wwc3kpvjqb] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.position-header-title[b-wwc3kpvjqb] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
}

.position-header-subtitle[b-wwc3kpvjqb] {
    font-size: 1.125rem;
    color: #6b7280;
    margin-top: 0.25rem;
}

.position-header-description[b-wwc3kpvjqb] {
    color: #374151;
    margin-top: 0.5rem;
}

.position-header-status[b-wwc3kpvjqb] {
    margin-top: 1rem;
}

/* Status badges now use StatusBadge component */

/* Candidates Card */
.candidates-card[b-wwc3kpvjqb] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.candidates-card-header[b-wwc3kpvjqb] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
}

.candidates-card-title[b-wwc3kpvjqb] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

.candidates-card-content[b-wwc3kpvjqb] {
    padding: 24px;
}

/* Refresh button now uses MainOutlinedButton component */

/* Buttons */
.btn[b-wwc3kpvjqb] {
    padding: 10px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn-secondary[b-wwc3kpvjqb] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-wwc3kpvjqb] {
    background: #5a6268;
}

.btn-primary[b-wwc3kpvjqb] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-wwc3kpvjqb] {
    background: #0056b3;
}

.btn-filled[b-wwc3kpvjqb] {
    background: #007bff;
    color: white;
}

.btn:disabled[b-wwc3kpvjqb] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Data Table */
.data-table[b-wwc3kpvjqb] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    border: 1px solid #e9ecef;
}

.data-table th[b-wwc3kpvjqb] {
    text-align: left;
    padding: 12px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    background: #f8f9fa;
    cursor: pointer;
    user-select: none;
}

.data-table th:hover[b-wwc3kpvjqb] {
    background: #e9ecef;
}

.data-table th:last-child[b-wwc3kpvjqb] {
    border-right: none;
}

.data-table td[b-wwc3kpvjqb] {
    padding: 12px;
    border-bottom: 1px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    vertical-align: middle;
}

.data-table td:last-child[b-wwc3kpvjqb] {
    border-right: none;
}

.data-table tr:hover[b-wwc3kpvjqb] {
    background: #f8f9fa;
}

.text-center[b-wwc3kpvjqb] {
    text-align: center;
}

/* Application status badges now use StatusBadge component */

/* Interview Score Badges */
.score-badge[b-wwc3kpvjqb] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.score-excellent[b-wwc3kpvjqb] {
    background-color: #dcfce7;
    color: #166534;
}

.score-good[b-wwc3kpvjqb] {
    background-color: #fef3c7;
    color: #92400e;
}

.score-fair[b-wwc3kpvjqb] {
    background-color: #dbeafe;
    color: #1e40af;
}

.score-poor[b-wwc3kpvjqb] {
    background-color: #fee2e2;
    color: #991b1b;
}

.score-na[b-wwc3kpvjqb] {
    font-size: 0.875rem;
    color: #6b7280;
}

/* Action buttons now use MainOutlinedButton component */

/* Empty State */
.empty-state[b-wwc3kpvjqb] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.empty-state-icon[b-wwc3kpvjqb] {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

.empty-state-title[b-wwc3kpvjqb] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #495057;
}

.empty-state-message[b-wwc3kpvjqb] {
    font-size: 14px;
    margin: 0;
    color: #6c757d;
}

/* Responsive Design */
@media (min-width: 640px) {
    .position-header-content[b-wwc3kpvjqb] {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .position-header-status[b-wwc3kpvjqb] {
        margin-top: 0;
    }

    .breadcrumb-list[b-wwc3kpvjqb] {
        gap: 0.75rem;
    }

    .breadcrumb-current[b-wwc3kpvjqb] {
        margin-left: 0.5rem;
    }
}
/* _content/Hirelab-frontend/Components/Pages/DeviceCheckTest.razor.rz.scp.css */
/* DeviceCheckTest.razor.css - Modern Redesign */

/* Container Styles */
.interview-container[b-cml4zduge3] {
    min-height: 100vh;
    padding: 16px 24px;
}

.container[b-cml4zduge3] {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* Paper Component */
.paper[b-cml4zduge3] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.pa-4[b-cml4zduge3] {
    padding: 24px;
}

.pa-6[b-cml4zduge3] {
    padding: 40px;
}

.pa-8[b-cml4zduge3] {
    padding: 48px;
}

.pa-md-6[b-cml4zduge3] {
    padding: 40px;
}

.mb-4[b-cml4zduge3] {
    margin-bottom: 24px;
}

.mt-4[b-cml4zduge3] {
    margin-top: 24px;
}

.mt-6[b-cml4zduge3] {
    margin-top: 24px;
}

.text-center[b-cml4zduge3] {
    text-align: center;
}

/* Loading State */
.loading-container[b-cml4zduge3] {
    padding: 60px 20px;
    text-align: center;
}

.loading-spinner[b-cml4zduge3] {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(102, 126, 234, 0.2);
    border-top: 5px solid #667eea;
    border-radius: 50%;
    animation: spin-b-cml4zduge3 0.8s linear infinite;
    margin: 0 auto 24px;
}

@keyframes spin-b-cml4zduge3 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-cml4zduge3] {
    font-size: 18px;
    font-weight: 600;
    color: #667eea;
    margin: 0;
}

/* Header With Actions */
.header-with-actions[b-cml4zduge3] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    gap: 24px;
}

.header-text[b-cml4zduge3] {
    flex: 1;
}

.header-text .text-h4[b-cml4zduge3],
.header-text .text-body1[b-cml4zduge3] {
    text-align: left;
}

.header-text .mb-4[b-cml4zduge3] {
    margin-bottom: 8px;
}

.header-text .text-body1.mb-4[b-cml4zduge3] {
    margin-bottom: 0;
}

.header-buttons[b-cml4zduge3] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 4px;
}

.header-buttons .btn-action[b-cml4zduge3] {
    padding: 10px 24px;
    font-size: 14px;
    min-width: 140px;
}

/* Main Content */
.text-h4[b-cml4zduge3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 8px 0;
    text-align: center;
    letter-spacing: -0.5px;
}

.text-h6[b-cml4zduge3] {
    font-size: 1.125rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0;
    line-height: 1.4;
}

.text-body1[b-cml4zduge3] {
    font-size: 0.95rem;
    color: #6b7280;
    margin: 0 0 24px 0;
    text-align: center;
    font-weight: 400;
}

.device-check-placeholder .text-body1[b-cml4zduge3] {
    font-size: 1.25rem;
    color: #4b5563;
    margin: 0;
    font-weight: 500;
}

.text-body2[b-cml4zduge3] {
    font-size: 1rem;
    color: #6b7280;
    font-weight: 500;
}

.text-secondary[b-cml4zduge3] {
    color: #9ca3af;
    font-size: 1.05rem;
}

.text-primary[b-cml4zduge3] {
    color: #667eea;
}

/* Grid System */
.grid[b-cml4zduge3] {
    display: grid;
    gap: 24px;
    width: 100%;
}

.device-check-grid[b-cml4zduge3] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

@media (min-width: 768px) {
    .device-check-grid[b-cml4zduge3] {
        grid-template-columns: repeat(2, 1fr);
    }
}

.grid-item[b-cml4zduge3] {
    width: 100%;
}

.grid-item-xs-12[b-cml4zduge3] {
    grid-column: 1 / -1;
}

@media (min-width: 768px) {
    .grid-item-md-6[b-cml4zduge3] {
        grid-column: span 1;
    }

    .grid-item-md-12[b-cml4zduge3] {
        grid-column: 1 / -1;
    }
}

/* Device Check Cards */
.device-check-card[b-cml4zduge3] {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    height: 420px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    position: relative;
}

.device-check-card .stack-row.justify-between[b-cml4zduge3] {
    height: 56px;
    margin-bottom: 0;
    padding-bottom: 16px;
    border-bottom: 1px solid #f3f4f6;
    align-items: center;
    position: relative;
    z-index: 10;
}

.device-check-card .stack-row.justify-between.mb-4[b-cml4zduge3] {
    margin-bottom: 0 !important;
}

.device-check-card .text-h6[b-cml4zduge3] {
    font-size: 1.125rem;
    line-height: 1.4;
}

.stack-row[b-cml4zduge3] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.justify-between[b-cml4zduge3] {
    justify-content: space-between;
    width: 100%;
}

.justify-center[b-cml4zduge3] {
    justify-content: center;
}

/* Device Check Content */
.device-check-content[b-cml4zduge3] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    position: relative;
    z-index: 1;
}

.device-check-video[b-cml4zduge3] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    border-radius: 12px;
    border: 2px solid #e5e7eb;
}

.device-check-content .text-center[b-cml4zduge3] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 8px;
}

.device-check-content .text-center .device-check-video[b-cml4zduge3] {
    flex: 1;
    width: 100%;
    min-height: 0;
    object-fit: cover;
}

.device-check-content .text-center .text-body2[b-cml4zduge3] {
    flex-shrink: 0;
}

.device-check-placeholder[b-cml4zduge3] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
    border-radius: 12px;
    border: 2px dashed #d1d5db;
    padding: 40px 24px;
    text-align: center;
    position: relative;
    z-index: 1;
}

.device-check-placeholder.recording[b-cml4zduge3] {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-color: #fbbf24;
    border-style: solid;
    animation: pulse-b-cml4zduge3 2s ease-in-out infinite;
}

@keyframes pulse-b-cml4zduge3 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.9; }
}

.device-check-placeholder.processing[b-cml4zduge3] {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
    border-color: #3b82f6;
    border-style: solid;
}

/* Full Width View (After Recording) */
.device-check-full-width[b-cml4zduge3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 100%;
}

.device-check-full-width .device-check-video[b-cml4zduge3] {
    max-width: 100%;
    width: 100%;
    height: 500px;
    object-fit: cover;
}

/* Chip */
.chip[b-cml4zduge3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    color: white;
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
}

.chip.small[b-cml4zduge3] {
    padding: 6px 12px;
    font-size: 11px;
    height: 24px;
    line-height: 1;
}

.chip.info[b-cml4zduge3] {
    background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);
}

.chip.success[b-cml4zduge3] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.chip.warning[b-cml4zduge3] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
}

.chip.error[b-cml4zduge3] {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

.chip.primary[b-cml4zduge3] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.chip.secondary[b-cml4zduge3] {
    background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%);
}

/* Buttons */
.btn[b-cml4zduge3] {
    padding: 12px 28px;
    border: 2px solid;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    letter-spacing: 0;
    transition: all 0.2s ease;
    transform: translateY(0);
}

.btn:hover:not(:disabled)[b-cml4zduge3] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.btn:active:not(:disabled)[b-cml4zduge3] {
    transform: translateY(0);
}

.btn-primary[b-cml4zduge3] {
    background: transparent;
    color: #667eea;
    border-color: #667eea;
}

.btn-primary:hover:not(:disabled)[b-cml4zduge3] {
    background: #667eea;
    color: white;
}

.btn-secondary[b-cml4zduge3] {
    background: transparent;
    color: #64748b;
    border-color: #64748b;
}

.btn-secondary:hover:not(:disabled)[b-cml4zduge3] {
    background: #64748b;
    color: white;
}

.btn-success[b-cml4zduge3] {
    background: transparent;
    color: #10b981;
    border-color: #10b981;
}

.btn-success:hover:not(:disabled)[b-cml4zduge3] {
    background: #10b981;
    color: white;
}

.btn-outline[b-cml4zduge3] {
    background: transparent;
    border: 2px solid #d1d5db;
    color: #6b7280;
}

.btn-outline:hover:not(:disabled)[b-cml4zduge3] {
    background: #f9fafb;
    border-color: #9ca3af;
}

.btn-outline-primary[b-cml4zduge3] {
    background: transparent;
    border: 2px solid #667eea;
    color: #667eea;
}

.btn-outline-primary:hover:not(:disabled)[b-cml4zduge3] {
    background: #667eea;
    color: white;
}

.btn-outline-success[b-cml4zduge3] {
    background: transparent;
    border: 2px solid #10b981;
    color: #10b981;
}

.btn-outline-success:hover:not(:disabled)[b-cml4zduge3] {
    background: #10b981;
    color: white;
}

.btn:disabled[b-cml4zduge3] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-large[b-cml4zduge3] {
    padding: 14px 32px;
    font-size: 15px;
    border-radius: 8px;
    font-weight: 600;
    min-width: 180px;
}

.btn-large:hover:not(:disabled)[b-cml4zduge3] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

.btn-medium[b-cml4zduge3] {
    padding: 8px 20px;
    font-size: 13px;
    min-width: 110px;
    height: 36px;
    line-height: 1;
}

.btn-action[b-cml4zduge3] {
    padding: 14px 32px;
    font-size: 15px;
    border-radius: 8px;
    font-weight: 600;
    min-width: 160px;
}

.btn-small[b-cml4zduge3] {
    padding: 8px 16px;
    font-size: 13px;
}

/* Stack Layout */
.stack[b-cml4zduge3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 100%;
}

/* Button Group */
.button-group-center[b-cml4zduge3] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    padding: 24px;
}

/* Responsive Adjustments */
@media (max-width: 767px) {
    .interview-container[b-cml4zduge3] {
        padding: 8px;
    }

    .header-with-actions[b-cml4zduge3] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        margin-bottom: 12px;
    }

    .header-text .text-h4[b-cml4zduge3],
    .header-text .text-body1[b-cml4zduge3] {
        text-align: center;
    }

    .header-buttons[b-cml4zduge3] {
        flex-direction: column;
        gap: 8px;
        margin-top: 0;
        width: 100%;
    }

    .header-buttons .btn-action[b-cml4zduge3] {
        width: 100%;
        padding: 10px 18px;
        font-size: 14px;
    }

    .text-h4[b-cml4zduge3] {
        font-size: 1.35rem;
        margin-bottom: 6px !important;
    }

    .text-body1[b-cml4zduge3] {
        font-size: 0.85rem;
        margin-bottom: 12px;
    }

    .device-check-grid[b-cml4zduge3] {
        gap: 16px;
        grid-template-columns: 1fr;
    }

    .grid-item[b-cml4zduge3] {
        grid-column: 1 / -1 !important;
    }

    .device-check-card[b-cml4zduge3] {
        padding: 20px;
        height: auto;
        min-height: 350px;
    }

    .device-check-content[b-cml4zduge3] {
        height: auto;
        min-height: 250px;
    }

    .device-check-card .stack-row.justify-between[b-cml4zduge3] {
        height: auto;
        min-height: 48px;
    }

    .btn-large[b-cml4zduge3] {
        padding: 12px 28px;
        font-size: 14px;
        min-width: 140px;
    }

    .btn-medium[b-cml4zduge3] {
        padding: 8px 16px;
        font-size: 12px;
        min-width: 90px;
        height: 32px;
    }

    .paper[b-cml4zduge3] {
        padding: 12px !important;
    }

    .container[b-cml4zduge3] {
        padding: 0 4px;
    }

    .device-check-placeholder[b-cml4zduge3] {
        padding: 30px 16px;
        min-height: 220px;
    }

    .button-group-center[b-cml4zduge3] {
        flex-direction: column;
        padding: 20px 0;
        gap: 12px;
    }

    .button-group-center .btn-action[b-cml4zduge3] {
        width: 100%;
        padding: 14px 24px;
        font-size: 15px;
    }

    .device-check-full-width[b-cml4zduge3] {
        padding: 20px 0;
        min-height: 500px;
    }

    .device-check-full-width .device-check-video[b-cml4zduge3] {
        width: 100%;
        height: auto;
        min-height: 450px;
        max-height: 70vh;
        aspect-ratio: 16/9;
        object-fit: cover;
    }

    .text-h6[b-cml4zduge3] {
        font-size: 1rem;
    }

    .chip.small[b-cml4zduge3] {
        font-size: 10px;
        padding: 4px 8px;
        height: 20px;
    }

    .device-check-content .text-center[b-cml4zduge3] {
        padding: 0;
    }

    .device-check-content .text-center .device-check-video[b-cml4zduge3] {
        width: 100%;
        min-height: 250px;
    }
}

/* Additional spacing utilities */
.mt-2[b-cml4zduge3] {
    margin-top: 8px;
}

.mb-2[b-cml4zduge3] {
    margin-bottom: 8px;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Candidates/CandidateDetails.razor.rz.scp.css */
/* CandidateDetails.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-lsg6brpitw] {
    padding: 24px;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

/* Breadcrumb styles imported from Breadcrumb.razor.css */

/* Status Badges */
.status-badge[b-lsg6brpitw] {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge.active[b-lsg6brpitw] {
    background: #d4edda;
    color: #155724;
}

.status-badge.inactive[b-lsg6brpitw] {
    background: #f8d7da;
    color: #721c24;
}

.verification-badge[b-lsg6brpitw] {
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 600;
}

.verification-badge.verified[b-lsg6brpitw] {
    background: #d4edda;
    color: #155724;
}

.verification-badge.unverified[b-lsg6brpitw] {
    background: #fff3cd;
    color: #856404;
}

/* Info Card */
.info-card[b-lsg6brpitw] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
    overflow: hidden;
}

.card-header[b-lsg6brpitw] {
    padding: 20px 24px;
    border-bottom: 2px solid #f8f9fa;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.card-title[b-lsg6brpitw] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.application-count[b-lsg6brpitw] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    background: #f8f9fa;
    padding: 6px 12px;
    border-radius: 16px;
}

.card-content[b-lsg6brpitw] {
    padding: 24px;
}

/* Info Grid */
.info-grid[b-lsg6brpitw] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.info-item[b-lsg6brpitw] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-label[b-lsg6brpitw] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
}

.info-value[b-lsg6brpitw] {
    font-size: 1rem;
    font-weight: 500;
    color: #212529;
}

/* Applications List - Compact Design */
.applications-list[b-lsg6brpitw] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.application-card[b-lsg6brpitw] {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
    transition: all 0.2s ease;
    background: #fafbfc;
}

.application-card:hover[b-lsg6brpitw] {
    border-color: #007bff;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.08);
}

.app-main-row[b-lsg6brpitw] {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.app-title-group[b-lsg6brpitw] {
    flex: 1;
    min-width: 200px;
}

.app-position-title[b-lsg6brpitw] {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.app-client-name[b-lsg6brpitw] {
    font-size: 0.8rem;
    color: #6c757d;
}

.app-meta-group[b-lsg6brpitw] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.app-invited[b-lsg6brpitw],
.app-template[b-lsg6brpitw] {
    font-size: 0.8rem;
    color: #495057;
    padding: 4px 8px;
    background: #fff;
    border-radius: 4px;
    border: 1px solid #dee2e6;
}

.app-interview-badge[b-lsg6brpitw] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 12px;
    white-space: nowrap;
}

.app-interview-badge.submitted[b-lsg6brpitw] {
    background: #d4edda;
    color: #155724;
}

.app-interview-badge.pending[b-lsg6brpitw] {
    background: #fff3cd;
    color: #856404;
}

.app-actions-group[b-lsg6brpitw] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
}

.app-status-badge[b-lsg6brpitw] {
    padding: 5px 12px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.app-status-badge.status-invited[b-lsg6brpitw] {
    background: #cfe2ff;
    color: #084298;
}

.app-status-badge.status-interviewed[b-lsg6brpitw] {
    background: #d1ecf1;
    color: #0c5460;
}

.app-status-badge.status-reviewed[b-lsg6brpitw] {
    background: #fff3cd;
    color: #856404;
}

.app-status-badge.status-approved[b-lsg6brpitw] {
    background: #d4edda;
    color: #155724;
}

.app-status-badge.status-denied[b-lsg6brpitw] {
    background: #f8d7da;
    color: #721c24;
}

.app-status-badge.status-uncertain[b-lsg6brpitw] {
    background: #e2e3e5;
    color: #383d41;
}

.app-status-badge.status-final-approved[b-lsg6brpitw] {
    background: #28a745;
    color: white;
}

.app-status-badge.status-final-denied[b-lsg6brpitw] {
    background: #dc3545;
    color: white;
}

.app-status-badge.status-default[b-lsg6brpitw] {
    background: #e9ecef;
    color: #495057;
}

.btn-compact[b-lsg6brpitw] {
    padding: 6px 14px;
    font-size: 0.85rem;
    font-weight: 500;
    border: 1px solid #007bff;
    background: transparent;
    color: #007bff;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.btn-compact:hover[b-lsg6brpitw] {
    background: #007bff;
    color: white;
}

/* Empty States */
.empty-applications[b-lsg6brpitw] {
    text-align: center;
    padding: 60px 20px;
}

.empty-icon[b-lsg6brpitw] {
    font-size: 4rem;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-text[b-lsg6brpitw] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

.empty-state[b-lsg6brpitw] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.empty-state-icon[b-lsg6brpitw] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 16px;
}

.empty-state-title[b-lsg6brpitw] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0 0 12px 0;
    color: #212529;
}

.empty-state-message[b-lsg6brpitw] {
    font-size: 1rem;
    margin: 0 0 24px 0;
    color: #6c757d;
}

/* Buttons */
.btn[b-lsg6brpitw] {
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn-sm[b-lsg6brpitw] {
    padding: 6px 14px;
    font-size: 0.8rem;
}

.btn-primary[b-lsg6brpitw] {
    background: #007bff;
    color: white;
}

.btn-primary:hover[b-lsg6brpitw] {
    background: #0056b3;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.3);
}

.btn-secondary[b-lsg6brpitw] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover[b-lsg6brpitw] {
    background: #5a6268;
    transform: translateY(-1px);
}

.btn-outline[b-lsg6brpitw] {
    background: transparent;
    color: #007bff;
    border: 2px solid #007bff;
}

.btn-outline:hover[b-lsg6brpitw] {
    background: #007bff;
    color: white;
}

/* Action Buttons Section */
.action-buttons-section[b-lsg6brpitw] {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 24px;
}

/* Loading States */
.loading-container[b-lsg6brpitw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-lsg6brpitw] {
    width: 50px;
    height: 50px;
    border: 4px solid #e9ecef;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-lsg6brpitw 1s linear infinite;
}

.loading-text[b-lsg6brpitw] {
    margin-top: 20px;
    font-size: 1.125rem;
    color: #6c757d;
    font-weight: 500;
}

@keyframes spin-b-lsg6brpitw {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Auth Required */
.auth-required[b-lsg6brpitw] {
    text-align: center;
    padding: 80px 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.auth-icon[b-lsg6brpitw] {
    font-size: 5rem;
    color: #dc3545;
    margin-bottom: 20px;
}

.auth-title[b-lsg6brpitw] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    color: #212529;
}

/* Responsive Design */
@media (min-width: 576px) {
    .info-grid[b-lsg6brpitw] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 768px) {
    .page-container[b-lsg6brpitw] {
        padding: 32px;
    }

    .info-grid[b-lsg6brpitw] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .app-main-row[b-lsg6brpitw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .app-meta-group[b-lsg6brpitw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
    }

    .app-actions-group[b-lsg6brpitw] {
        width: 100%;
        margin-left: 0;
        justify-content: space-between;
    }

    .btn-compact[b-lsg6brpitw] {
        flex: 1;
    }
}

/* Interview History Template Styles */
.template-list[b-lsg6brpitw] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.template-item[b-lsg6brpitw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    transition: all 0.2s;
}

.template-item:hover[b-lsg6brpitw] {
    border-color: #4f46e5;
    box-shadow: 0 2px 8px rgba(79, 70, 229, 0.1);
}

.template-info[b-lsg6brpitw] {
    flex: 1;
}

.template-header[b-lsg6brpitw] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.template-position[b-lsg6brpitw] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #111827;
}

.template-status[b-lsg6brpitw] {
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
}

.template-status.completed[b-lsg6brpitw] {
    background: #d1fae5;
    color: #065f46;
}

.template-status.pending[b-lsg6brpitw] {
    background: #fef3c7;
    color: #92400e;
}

.template-details[b-lsg6brpitw] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    color: #6b7280;
}

.template-name[b-lsg6brpitw] {
    font-weight: 500;
    color: #4f46e5;
}

.template-dot[b-lsg6brpitw] {
    color: #d1d5db;
}

.template-actions[b-lsg6brpitw] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.btn-template-questions[b-lsg6brpitw],
.btn-template-interview[b-lsg6brpitw],
.btn-template-delete[b-lsg6brpitw] {
    padding: 10px 18px;
    border: none;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-template-questions[b-lsg6brpitw] {
    background: #f3f4f6;
    color: #374151;
}

.btn-template-questions:hover[b-lsg6brpitw] {
    background: #e5e7eb;
}

.btn-template-interview[b-lsg6brpitw] {
    background: #4f46e5;
    color: white;
}

.btn-template-interview:hover[b-lsg6brpitw] {
    background: #4338ca;
}

.btn-template-delete[b-lsg6brpitw] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.btn-template-delete:hover:not(:disabled)[b-lsg6brpitw] {
    background: #fecaca;
    border-color: #f87171;
    color: #7f1d1d;
}

.btn-template-delete:disabled[b-lsg6brpitw] {
    background: #f3f4f6;
    color: #9ca3af;
    border-color: #e5e7eb;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Card Header Left Section */
.card-header-left[b-lsg6brpitw] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
}

/* Upload Interview Button */
.btn-upload-interview[b-lsg6brpitw] {
    background: #4f46e5;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.btn-upload-interview:hover[b-lsg6brpitw] {
    background: #4338ca;
    transform: translateY(-1px);
}

.btn-upload-interview:active[b-lsg6brpitw] {
    transform: translateY(0);
}

@media (max-width: 768px) {
    .template-item[b-lsg6brpitw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .template-actions[b-lsg6brpitw] {
        width: 100%;
        flex-direction: column;
    }

    .btn-template-questions[b-lsg6brpitw],
    .btn-template-interview[b-lsg6brpitw],
    .btn-template-delete[b-lsg6brpitw] {
        width: 100%;
    }

    .card-header[b-lsg6brpitw] {
        flex-direction: column;
        align-items: flex-start;
    }

    .card-header-left[b-lsg6brpitw] {
        width: 100%;
    }

    .btn-upload-interview[b-lsg6brpitw] {
        width: 100%;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Candidates/CandidatesList.razor.rz.scp.css */
/* CandidatesList.razor.css - Blazor CSS Isolation */

/* Global Box Sizing */
*[b-04r0sdggg0] {
    box-sizing: border-box;
}

/* Page Container */
.page-container[b-04r0sdggg0] {
    padding: 24px;
    max-width: 100%;
    margin: 0;
    width: 100%;
    box-sizing: border-box;
}

/* Page Header */
.page-header[b-04r0sdggg0] {
    margin-bottom: 24px;
}

.page-title[b-04r0sdggg0] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

/* Breadcrumb styles imported from Breadcrumb.razor.css */

/* Action Bar */
.action-bar[b-04r0sdggg0] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
    box-sizing: border-box;
    width: 100%;
}

.search-controls[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    align-items: stretch;
}

/* Search Field Styling */
.text-field[b-04r0sdggg0] {
    position: relative;
    width: 100%;
    box-sizing: border-box;
    max-width: 100%;
}

@media (min-width: 768px) {
    .text-field.search-field[b-04r0sdggg0] {
        width: auto;
        min-width: 300px;
        max-width: 400px;
    }
}

.text-field input[b-04r0sdggg0] {
    width: 100%;
    padding: 12px 16px 12px 40px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    font-size: 16px;
    background: white;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
    max-width: 100%;
}

.text-field input:focus[b-04r0sdggg0] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.text-field .input-icon[b-04r0sdggg0] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
    font-size: 18px;
}

.action-controls[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    align-items: stretch;
}

/* Form Elements */
.form-input[b-04r0sdggg0] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 40px;
}

.form-input:focus[b-04r0sdggg0] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-04r0sdggg0] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-04r0sdggg0]::placeholder {
    color: #6b7280;
    opacity: 1;
}

/* Switch Styling */
.switch-container[b-04r0sdggg0] {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin: 8px 0;
}

.switch-input[b-04r0sdggg0] {
    display: none;
}

.switch-slider[b-04r0sdggg0] {
    width: 44px;
    height: 24px;
    background-color: #d1d5db;
    border-radius: 12px;
    position: relative;
    transition: background-color 0.2s;
    margin-right: 12px;
}

.switch-slider[b-04r0sdggg0]::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background-color: white;
    border-radius: 50%;
    transition: transform 0.2s;
}

.switch-input:checked + .switch-slider[b-04r0sdggg0] {
    background-color: #007bff;
}

.switch-input:checked + .switch-slider[b-04r0sdggg0]::before {
    transform: translateX(20px);
}

.switch-label[b-04r0sdggg0] {
    font-size: 0.875rem;
    color: #374151;
    user-select: none;
}

/* Data Table */
.data-table[b-04r0sdggg0] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
    box-sizing: border-box;
}

.data-table th[b-04r0sdggg0] {
    text-align: left;
    padding: 12px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #e9ecef;
    border-right: 1px solid #e9ecef;
    background: #f8f9fa;
}

.data-table th:last-child[b-04r0sdggg0] {
    border-right: none;
}

.data-table td[b-04r0sdggg0] {
    padding: 12px;
    border-bottom: 1px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    vertical-align: middle;
}

.data-table td:last-child[b-04r0sdggg0] {
    border-right: none;
}

.data-table tr:hover[b-04r0sdggg0] {
    background: #f8f9fa;
}

.text-center[b-04r0sdggg0] {
    text-align: center;
}

.hide-mobile[b-04r0sdggg0] {
    display: table-cell;
}

.hide-tablet[b-04r0sdggg0] {
    display: table-cell;
}

/* Status Badges */
.status-badge[b-04r0sdggg0] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.status-badge.active[b-04r0sdggg0] {
    background: #d4edda;
    color: #155724;
}

.status-badge.inactive[b-04r0sdggg0] {
    background: #fff3cd;
    color: #856404;
}

.status-badge.suspended[b-04r0sdggg0] {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.info[b-04r0sdggg0] {
    background: #d1ecf1;
    color: #0c5460;
}

/* Form Select - Modern Radix/shadcn style */
.form-select[b-04r0sdggg0] {
    width: 100%;
    padding: 10px 36px 10px 14px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 12px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    min-height: 42px;
}

.form-select:focus[b-04r0sdggg0] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-select:hover:not(:focus):not(:disabled)[b-04r0sdggg0] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-select:disabled[b-04r0sdggg0] {
    opacity: 0.6;
    cursor: not-allowed;
    background-color: #f1f3f5;
    color: #868e96;
}

.form-select option[b-04r0sdggg0] {
    padding: 8px;
    background-color: #ffffff;
    color: #1a1a1a;
}

/* Action Dropdown */
.action-dropdown[b-04r0sdggg0] {
    position: relative;
    display: inline-block;
}

.action-select[b-04r0sdggg0] {
    appearance: none;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 6px 24px 6px 8px;
    font-size: 12px;
    color: #495057;
    cursor: pointer;
    min-width: 80px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 6px center;
    background-repeat: no-repeat;
    background-size: 12px 12px;
}

.action-select:focus[b-04r0sdggg0] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

/* Mobile Card View */
.mobile-card-view[b-04r0sdggg0] {
    display: none;
}

.candidate-card[b-04r0sdggg0] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    width: 100%;
}

.candidate-card-header[b-04r0sdggg0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.candidate-card-title[b-04r0sdggg0] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.candidate-card-email[b-04r0sdggg0] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.candidate-card-info[b-04r0sdggg0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.candidate-card-info-item[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.candidate-card-info-label[b-04r0sdggg0] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    font-weight: 600;
}

.candidate-card-info-value[b-04r0sdggg0] {
    font-size: 0.875rem;
    color: #212529;
    font-weight: 500;
}

.candidate-card-actions[b-04r0sdggg0] {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 12px;
}

.candidate-card-actions .action-buttons[b-04r0sdggg0] {
    display: flex;
    gap: 12px;
    width: 100%;
}

.candidate-card-actions .action-btn[b-04r0sdggg0] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px 14px !important;
    min-height: 40px !important;
    font-size: 14px !important;
    background: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
    flex: 1 !important;
}

.candidate-card-actions .action-btn svg[b-04r0sdggg0] {
    width: 18px !important;
    height: 18px !important;
}

.candidate-card-actions .action-btn-text[b-04r0sdggg0] {
    display: inline !important;
    font-weight: 500 !important;
}

/* Hover effects for action buttons */
.candidate-card-actions .action-btn.view-btn:hover[b-04r0sdggg0] {
    background: #007bff !important;
    color: white !important;
    border-color: #007bff !important;
}

.candidate-card-actions .action-btn.edit-btn:hover[b-04r0sdggg0] {
    background: #28a745 !important;
    color: white !important;
    border-color: #28a745 !important;
}

.candidate-card-actions .action-btn.delete-btn:hover[b-04r0sdggg0] {
    background: #dc3545 !important;
    color: white !important;
    border-color: #dc3545 !important;
}

/* Buttons */
.btn[b-04r0sdggg0] {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 36px;
}

.btn-sm[b-04r0sdggg0] {
    padding: 6px 12px;
    font-size: 12px;
    min-height: 32px;
}

.btn-primary[b-04r0sdggg0] {
    background: #007bff;
    color: white;
}

.btn-primary:hover[b-04r0sdggg0] {
    background: #0056b3;
}

.btn-outline[b-04r0sdggg0] {
    background: transparent;
    color: #007bff;
    border: 1px solid #007bff;
}

.btn-outline:hover[b-04r0sdggg0] {
    background: #007bff;
    color: white;
}

.btn-secondary[b-04r0sdggg0] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover[b-04r0sdggg0] {
    background: #5a6268;
}

.btn-filters[b-04r0sdggg0] {
    background: #007bff;
    color: white;
    position: relative;
    overflow: hidden;
    border: none;
}

.btn-filters:hover[b-04r0sdggg0] {
    background: #0056b3;
}

.btn-filters:active[b-04r0sdggg0] {
    transform: translateY(0);
}

.filter-icon[b-04r0sdggg0] {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 18px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
}

.btn-danger[b-04r0sdggg0] {
    background: #dc3545;
    color: white;
}

.btn-danger:hover[b-04r0sdggg0] {
    background: #c82333;
}

.btn-text[b-04r0sdggg0] {
    background: transparent;
    color: #6c757d;
    border: none;
    padding: 6px 12px;
}

.btn-text:hover[b-04r0sdggg0] {
    background: #f8f9fa;
    color: #495057;
}

.btn-icon[b-04r0sdggg0] {
    font-size: 16px;
    line-height: 1;
}

/* Loading and Empty States */
.loading-container[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-04r0sdggg0] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-04r0sdggg0 1s linear infinite;
}

.loading-text[b-04r0sdggg0] {
    margin-top: 16px;
    font-size: 1.125rem;
    color: #6c757d;
}

.empty-state[b-04r0sdggg0] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
}

.empty-state-icon[b-04r0sdggg0] {
    font-size: 4rem;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-state-title[b-04r0sdggg0] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #495057;
}

.empty-state-message[b-04r0sdggg0] {
    font-size: 14px;
    margin: 0;
    color: #6c757d;
}

.auth-required[b-04r0sdggg0] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
}

.auth-icon[b-04r0sdggg0] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 16px;
}

.auth-title[b-04r0sdggg0] {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
    color: #495057;
}

@keyframes spin-b-04r0sdggg0 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (min-width: 768px) {
    .page-container[b-04r0sdggg0] {
        padding: 32px;
    }

    .page-title[b-04r0sdggg0] {
        font-size: 2.5rem;
    }

    .action-bar[b-04r0sdggg0] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
    }

    .search-controls[b-04r0sdggg0] {
        flex-direction: row;
        width: auto;
        gap: 16px;
        align-items: center;
        flex: 1;
        max-width: 400px;
    }

    .action-controls[b-04r0sdggg0] {
        width: auto;
        flex-shrink: 0;
        align-items: center;
        flex-direction: row;
    }

    .hide-mobile[b-04r0sdggg0] {
        display: table-cell;
    }
}

@media (max-width: 767px) {
    .page-container[b-04r0sdggg0] {
        padding: 16px;
        margin: 0 auto;
    }

    .page-title[b-04r0sdggg0] {
        font-size: 1.5rem;
    }

    .hide-mobile[b-04r0sdggg0] {
        display: none;
    }

    .mobile-card-view[b-04r0sdggg0] {
        display: block;
    }

    .form-input.search-field[b-04r0sdggg0] {
        padding: 10px 14px;
        font-size: 16px;
    }

    .action-bar[b-04r0sdggg0] {
        padding: 12px;
        margin-left: 0;
        margin-right: 0;
    }

    .desktop-grid[b-04r0sdggg0] {
        display: none;
    }

    .data-table[b-04r0sdggg0] {
        width: 100%;
    }

    .mobile-only[b-04r0sdggg0] {
        display: inline;
    }

    .desktop-only[b-04r0sdggg0] {
        display: none;
    }
}

@media (max-width: 1199px) {
    .hide-tablet[b-04r0sdggg0] {
        display: none;
    }
}

@media (min-width: 480px) {
    .mobile-card-view[b-04r0sdggg0] {
        display: none;
    }

    .desktop-grid[b-04r0sdggg0] {
        display: block;
    }

    .text-field input[b-04r0sdggg0] {
        padding: 10px 14px 10px 36px;
        font-size: 16px;
    }
}

/* Additional Utility Classes */
.text-muted[b-04r0sdggg0] {
    color: #6c757d;
}

.mobile-only[b-04r0sdggg0] {
    display: none;
}

.desktop-only[b-04r0sdggg0] {
    display: inline;
}

.candidate-name[b-04r0sdggg0] {
    font-weight: 600;
    color: #212529;
    margin-bottom: 4px;
}

.candidate-email[b-04r0sdggg0] {
    font-size: 0.875rem;
    color: #6c757d;
}

.mobile-info[b-04r0sdggg0] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 2px;
}

.candidate-name-cell[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.location-cell[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Actions Header */
.actions-header[b-04r0sdggg0] {
    white-space: nowrap;
}

.actions-text-mobile[b-04r0sdggg0] {
    display: none;
}

.actions-text-full[b-04r0sdggg0] {
    display: inline;
}

/* Action buttons styles imported from ActionButtons.razor.css */

/* Review Summary Styles */
.review-summary[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.review-rating[b-04r0sdggg0] {
    display: flex;
    gap: 2px;
}

.review-rating .star[b-04r0sdggg0] {
    font-size: 0.875rem;
    color: #d1d5db;
}

.review-rating .star.filled[b-04r0sdggg0] {
    color: #f59e0b;
}

.review-count[b-04r0sdggg0] {
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: 500;
}

/* Filters Panel */
.filters-panel[b-04r0sdggg0] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
}

.filters-grid[b-04r0sdggg0] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.filter-group[b-04r0sdggg0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.filter-label[b-04r0sdggg0] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #495057;
}

.filters-actions[b-04r0sdggg0] {
    display: flex;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px solid #e9ecef;
}

.active-filters[b-04r0sdggg0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.filter-chip[b-04r0sdggg0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 16px;
    padding: 4px 12px;
    font-size: 0.875rem;
    color: #495057;
}

.filter-chip button[b-04r0sdggg0] {
    background: none;
    border: none;
    color: #6c757d;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    margin: 0;
}

.filter-chip button:hover[b-04r0sdggg0] {
    color: #dc3545;
}

.badge[b-04r0sdggg0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: #dc3545;
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 10px;
    margin-left: 6px;
}

.btn-filters .badge[b-04r0sdggg0] {
    background: #dc3545;
    color: white;
    border-radius: 12px;
    padding: 2px 6px;
    font-size: 11px;
    font-weight: bold;
    margin-left: 6px;
}

@media (max-width: 768px) {
    .filters-grid[b-04r0sdggg0] {
        grid-template-columns: 1fr;
    }

    .text-field input[b-04r0sdggg0] {
        padding: 8px 12px 8px 32px;
        font-size: 14px;
    }

    .text-field .input-icon[b-04r0sdggg0] {
        left: 10px;
        font-size: 14px;
    }
}

@media (max-width: 576px) {
    /* Show abbreviated actions header on mobile */
    .actions-text-full[b-04r0sdggg0] {
        display: none;
    }

    .actions-text-mobile[b-04r0sdggg0] {
        display: inline;
        font-size: 18px;
        letter-spacing: 2px;
    }

    /* Tighter action button spacing on mobile */
    .action-buttons[b-04r0sdggg0] {
        gap: 8px;
    }

    .action-btn[b-04r0sdggg0] {
        min-width: 32px;
        min-height: 32px;
        padding: 6px;
    }

    /* Smaller search field on mobile */
    .form-input.search-field[b-04r0sdggg0] {
        padding: 8px 12px;
        font-size: 14px;
    }

    .page-container[b-04r0sdggg0] {
        padding: 12px;
        margin: 0 auto;
    }

    .action-bar[b-04r0sdggg0] {
        padding: 10px;
        margin-left: 0;
        margin-right: 0;
    }

    .page-title[b-04r0sdggg0] {
        font-size: 1.375rem;
    }

    .breadcrumbs[b-04r0sdggg0] {
        font-size: 13px;
    }

    /* Mobile card styles */
    .candidate-card[b-04r0sdggg0] {
        padding: 14px;
        margin-bottom: 10px;
    }

    .candidate-card-title[b-04r0sdggg0] {
        font-size: 1rem;
    }

    .candidate-card-info[b-04r0sdggg0] {
        gap: 10px;
    }

    /* Mobile card action button adjustments */
    .candidate-card-actions .action-btn[b-04r0sdggg0] {
        padding: 8px 10px !important;
        min-height: 38px !important;
        font-size: 13px !important;
        gap: 4px !important;
    }

    .candidate-card-actions .action-btn svg[b-04r0sdggg0] {
        width: 16px !important;
        height: 16px !important;
    }
}

@media (max-width: 400px) {
    .page-container[b-04r0sdggg0] {
        padding: 10px;
    }

    .action-bar[b-04r0sdggg0] {
        padding: 8px;
        gap: 12px;
    }

    .form-input.search-field[b-04r0sdggg0] {
        padding: 8px 10px;
        font-size: 14px;
    }

    .page-title[b-04r0sdggg0] {
        font-size: 1.25rem;
    }

    .candidate-card[b-04r0sdggg0] {
        padding: 12px;
        margin-bottom: 8px;
    }

    .candidate-card-title[b-04r0sdggg0] {
        font-size: 0.938rem;
    }

    .candidate-card-info[b-04r0sdggg0] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    /* Stack card action buttons vertically on very small screens */
    .candidate-card-actions .action-buttons[b-04r0sdggg0] {
        flex-direction: column;
        gap: 8px;
    }

    .candidate-card-actions .action-btn[b-04r0sdggg0] {
        width: 100% !important;
        padding: 10px 12px !important;
        justify-content: flex-start !important;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Candidates/InterviewReview.razor.rz.scp.css */
/* InterviewReview.razor.css - Blazor CSS Isolation */

.page-container[b-gthejxy1r4] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px;
}

.interview-header[b-gthejxy1r4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 2px solid #e5e7eb;
}

.interview-title[b-gthejxy1r4] {
    margin: 0 0 12px 0;
    font-size: 2rem;
    font-weight: 700;
    color: #111827;
}

.interview-meta[b-gthejxy1r4] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    color: #6b7280;
}

.meta-item[b-gthejxy1r4] {
    color: #6b7280;
}

.meta-separator[b-gthejxy1r4] {
    color: #d1d5db;
}

.btn-back[b-gthejxy1r4] {
    padding: 10px 20px;
    background: #f3f4f6;
    color: #374151;
    border: none;
    border-radius: 8px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-back:hover[b-gthejxy1r4] {
    background: #e5e7eb;
}

.interview-responses[b-gthejxy1r4] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.response-card[b-gthejxy1r4] {
    background: white;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.response-question[b-gthejxy1r4] {
    padding: 24px;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.question-header[b-gthejxy1r4] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.question-number[b-gthejxy1r4] {
    font-weight: 600;
    color: #4f46e5;
    font-size: 0.9rem;
}

.question-type[b-gthejxy1r4] {
    padding: 4px 10px;
    background: #e0e7ff;
    color: #4338ca;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

.question-text[b-gthejxy1r4] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 500;
    color: #111827;
    line-height: 1.5;
}

.response-answer[b-gthejxy1r4] {
    padding: 24px;
}

.video-container[b-gthejxy1r4] {
    width: 100%;
}

.response-video[b-gthejxy1r4] {
    width: 100%;
    max-height: 500px;
    border-radius: 8px;
    background: #000;
}

.video-meta[b-gthejxy1r4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
    font-size: 0.85rem;
    color: #6b7280;
}

.video-date[b-gthejxy1r4] {
    color: #6b7280;
}

.video-duration[b-gthejxy1r4] {
    color: #6b7280;
}

.text-response[b-gthejxy1r4] {
    padding: 20px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

.text-response-label[b-gthejxy1r4] {
    font-weight: 600;
    color: #6b7280;
    font-size: 0.85rem;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.text-response-content[b-gthejxy1r4] {
    margin: 0 0 12px 0;
    color: #111827;
    line-height: 1.6;
}

.response-date[b-gthejxy1r4] {
    font-size: 0.85rem;
    color: #6b7280;
}

.no-answer[b-gthejxy1r4] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 20px;
    background: #fef3c7;
    border-radius: 8px;
    color: #92400e;
}

.no-answer-icon[b-gthejxy1r4] {
    font-size: 1.25rem;
}

.no-answer-text[b-gthejxy1r4] {
    color: #92400e;
}

.no-responses-card[b-gthejxy1r4] {
    text-align: center;
    padding: 60px 40px;
    background: white;
    border-radius: 12px;
    border: 2px dashed #e5e7eb;
}

.no-responses-icon[b-gthejxy1r4] {
    font-size: 3rem;
    margin-bottom: 16px;
}

.no-responses-card h3[b-gthejxy1r4] {
    margin: 0 0 8px 0;
    color: #111827;
}

.no-responses-card p[b-gthejxy1r4] {
    margin: 0;
    color: #6b7280;
}

.loading-container[b-gthejxy1r4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
}

.loading-spinner[b-gthejxy1r4] {
    width: 50px;
    height: 50px;
    border: 4px solid #e5e7eb;
    border-top-color: #4f46e5;
    border-radius: 50%;
    animation: spin-b-gthejxy1r4 1s linear infinite;
}

@keyframes spin-b-gthejxy1r4 {
    to {
        transform: rotate(360deg);
    }
}

.loading-text[b-gthejxy1r4] {
    color: #6b7280;
    font-size: 0.95rem;
}

.empty-state[b-gthejxy1r4] {
    text-align: center;
    padding: 80px 40px;
}

.empty-state-icon[b-gthejxy1r4] {
    font-size: 4rem;
    margin-bottom: 16px;
}

.empty-state-title[b-gthejxy1r4] {
    margin: 0 0 8px 0;
    font-size: 1.5rem;
    color: #111827;
}

.empty-state-message[b-gthejxy1r4] {
    margin: 0 0 24px 0;
    color: #6b7280;
}

.btn[b-gthejxy1r4] {
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 500;
    text-decoration: none;
    display: inline-block;
    transition: all 0.2s;
}

.btn-primary[b-gthejxy1r4] {
    background: #4f46e5;
    color: white;
    border: none;
}

.btn-primary:hover[b-gthejxy1r4] {
    background: #4338ca;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Clients/CandidateReview.razor.rz.scp.css */
/* CandidateReview.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-wsoga0n4d4] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Loading and Auth States */
.loading-container[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-wsoga0n4d4] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-wsoga0n4d4 1s linear infinite;
}

.loading-text[b-wsoga0n4d4] {
    margin-top: 16px;
    font-size: 1.125rem;
    color: #6c757d;
}

@keyframes spin-b-wsoga0n4d4 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Redo Interview Modal */
.modal-overlay[b-wsoga0n4d4] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
}

.modal-container[b-wsoga0n4d4] {
    background: white;
    border-radius: 12px;
    max-width: 500px;
    width: 100%;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    animation: slideIn-b-wsoga0n4d4 0.2s ease-out;
}

@keyframes slideIn-b-wsoga0n4d4 {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.modal-header[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.modal-title[b-wsoga0n4d4] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
}

.modal-close[b-wsoga0n4d4] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    transition: all 0.2s;
}

.modal-close:hover[b-wsoga0n4d4] {
    background: #f3f4f6;
    color: #374151;
}

.modal-body[b-wsoga0n4d4] {
    padding: 24px;
}

.warning-box[b-wsoga0n4d4] {
    display: flex;
    gap: 16px;
    padding: 20px;
    background: #fef3c7;
    border: 1px solid #fbbf24;
    border-radius: 8px;
}

.warning-icon[b-wsoga0n4d4] {
    font-size: 2rem;
    flex-shrink: 0;
}

.warning-content[b-wsoga0n4d4] {
    flex: 1;
}

.warning-title[b-wsoga0n4d4] {
    margin: 0 0 12px 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #92400e;
}

.warning-text[b-wsoga0n4d4] {
    margin: 0 0 8px 0;
    color: #78350f;
    font-weight: 500;
}

.warning-list[b-wsoga0n4d4] {
    margin: 8px 0 16px 20px;
    padding: 0;
    color: #78350f;
}

.warning-list li[b-wsoga0n4d4] {
    margin: 6px 0;
}

.warning-note[b-wsoga0n4d4] {
    margin: 12px 0 0 0;
    padding-top: 12px;
    border-top: 1px solid #fbbf24;
    color: #92400e;
    font-size: 0.9rem;
}

.modal-footer[b-wsoga0n4d4] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
}

.modal-footer .btn[b-wsoga0n4d4] {
    min-width: 120px;
}

/* Breadcrumbs */
.breadcrumbs[b-wsoga0n4d4] {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.breadcrumb-item[b-wsoga0n4d4] {
    color: #007bff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.breadcrumb-item:hover[b-wsoga0n4d4] {
    text-decoration: underline;
}

.breadcrumb-item.disabled[b-wsoga0n4d4] {
    color: #6c757d;
    cursor: default;
}

.breadcrumb-separator[b-wsoga0n4d4] {
    color: #6c757d;
    font-size: 14px;
}

/* Main Grid Layout */
.main-grid[b-wsoga0n4d4] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr;
}

/* Candidate Details Card */
.candidate-card[b-wsoga0n4d4] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.candidate-card-header[b-wsoga0n4d4] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.candidate-card-title[b-wsoga0n4d4] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.candidate-card-content[b-wsoga0n4d4] {
    padding: 24px;
}

.candidate-info-grid[b-wsoga0n4d4] {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.info-field[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-label[b-wsoga0n4d4] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    font-weight: 600;
}

.info-value[b-wsoga0n4d4] {
    font-size: 1rem;
    color: #212529;
    font-weight: 500;
}

/* Status Badges */
.status-badge[b-wsoga0n4d4] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    display: inline-block;
}

.status-badge.invited[b-wsoga0n4d4] {
    background: #d1ecf1;
    color: #0c5460;
}

.status-badge.interviewed[b-wsoga0n4d4] {
    background: #cce5ff;
    color: #004085;
}

.status-badge.reviewed[b-wsoga0n4d4] {
    background: #fff3cd;
    color: #856404;
}

.status-badge.approved[b-wsoga0n4d4] {
    background: #d4edda;
    color: #155724;
}

.status-badge.denied[b-wsoga0n4d4] {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.uncertain[b-wsoga0n4d4] {
    background: #e2e3e5;
    color: #383d41;
}

.status-badge.finalapproved[b-wsoga0n4d4] {
    background: #d4edda;
    color: #155724;
}

.status-badge.finaldenied[b-wsoga0n4d4] {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.pending[b-wsoga0n4d4] {
    background: #e2e8f0;
    color: #475569;
}

.status-badge.notified[b-wsoga0n4d4] {
    background: #d1ecf1;
    color: #0c5460;
}

.status-badge.reviewed[b-wsoga0n4d4] {
    background: #cce5ff;
    color: #004085;
}

.status-badge.accepted[b-wsoga0n4d4] {
    background: #d4edda;
    color: #155724;
}

.status-badge.rejected[b-wsoga0n4d4] {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.duration[b-wsoga0n4d4] {
    background: #343a40;
    color: white;
}

/* Actions Panel */
.actions-panel[b-wsoga0n4d4] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.actions-panel-header[b-wsoga0n4d4] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.actions-panel-title[b-wsoga0n4d4] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.actions-panel-content[b-wsoga0n4d4] {
    padding: 24px;
}

.actions-stack[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.action-divider[b-wsoga0n4d4] {
    height: 1px;
    background: #e9ecef;
    margin: 8px 0;
}

.action-group-label[b-wsoga0n4d4] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #64748b;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    margin-top: 4px;
}

/* Internal Notes Panel */
.notes-panel[b-wsoga0n4d4] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid #e9ecef;
    overflow: hidden;
    margin-top: 24px;
}

.notes-panel-header[b-wsoga0n4d4] {
    padding: 18px 24px;
    background: linear-gradient(to bottom, #f8f9fa, #ffffff);
    border-bottom: 2px solid #e9ecef;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notes-panel-title[b-wsoga0n4d4] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.notes-subtitle[b-wsoga0n4d4] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6366f1;
    background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%);
    padding: 5px 12px;
    border-radius: 14px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    border: 1px solid #c7d2fe;
}

.notes-panel-content[b-wsoga0n4d4] {
    padding: 24px;
    background: #fafbfc;
}

.notes-textarea[b-wsoga0n4d4] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    font-size: 14px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    line-height: 1.6;
    resize: vertical;
    transition: all 0.2s ease;
    min-height: 120px;
    background: white;
    color: #1e293b;
    box-sizing: border-box;
}

.notes-textarea:hover[b-wsoga0n4d4] {
    border-color: #cbd5e1;
}

.notes-textarea:focus[b-wsoga0n4d4] {
    outline: none;
    border-color: #6366f1;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1);
    background: white;
}

.notes-textarea[b-wsoga0n4d4]::placeholder {
    color: #94a3b8;
    font-style: italic;
}

.notes-footer[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
    gap: 12px;
}

.character-counter[b-wsoga0n4d4] {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
    font-family: 'Courier New', monospace;
    background: white;
    padding: 6px 12px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.btn-sm[b-wsoga0n4d4] {
    padding: 10px 24px;
    font-size: 14px;
    min-height: 40px;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(99, 102, 241, 0.2);
}

.btn-sm:hover:not(:disabled)[b-wsoga0n4d4] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(99, 102, 241, 0.3);
}

.btn-sm:active:not(:disabled)[b-wsoga0n4d4] {
    transform: translateY(0);
}

.btn-sm:disabled[b-wsoga0n4d4] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Buttons */
.btn[b-wsoga0n4d4] {
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 44px;
    width: 100%;
}

.btn:disabled[b-wsoga0n4d4] {
    opacity: 0.5;
    cursor: not-allowed !important;
}

.btn-outline[b-wsoga0n4d4] {
    background: transparent;
    border: 2px solid;
}

.btn-text[b-wsoga0n4d4] {
    background: transparent;
    border: none;
    box-shadow: none;
}

/* Override tenant theme colors for action buttons - use fixed semantic colors */
.btn-success.btn-outline[b-wsoga0n4d4] {
    color: #28a745 !important;
    border-color: #28a745 !important;
    background: transparent !important;
}

.btn-success.btn-outline:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #28a745 !important;
    color: white !important;
}

.btn-success.btn-filled[b-wsoga0n4d4] {
    background: #059669 !important;
    color: white !important;
}

.btn-success.btn-filled:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #047857 !important;
}

.btn-danger.btn-outline[b-wsoga0n4d4] {
    color: #dc3545 !important;
    border-color: #dc3545 !important;
    background: transparent !important;
}

.btn-danger.btn-outline:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #dc3545 !important;
    color: white !important;
}

.btn-danger.btn-filled[b-wsoga0n4d4] {
    background: #dc2626 !important;
    color: white !important;
}

.btn-danger.btn-filled:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #b91c1c !important;
}

.btn-warning.btn-outline[b-wsoga0n4d4] {
    color: #ffc107 !important;
    border-color: #ffc107 !important;
    background: transparent !important;
}

.btn-warning.btn-outline:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #ffc107 !important;
    color: #212529 !important;
}

.btn-secondary.btn-text[b-wsoga0n4d4] {
    color: #6c757d !important;
    background: transparent !important;
}

.btn-secondary.btn-text:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #f8f9fa !important;
    color: #495057 !important;
}

.btn-primary.btn-text[b-wsoga0n4d4] {
    color: #007bff !important;
    background: transparent !important;
}

.btn-primary.btn-text:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #e3f2fd !important;
    color: #0056b3 !important;
}

/* Interview Videos Section */
.videos-card[b-wsoga0n4d4] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.videos-card-header[b-wsoga0n4d4] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.videos-card-title[b-wsoga0n4d4] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.videos-card-content[b-wsoga0n4d4] {
    padding: 24px;
}

.videos-grid[b-wsoga0n4d4] {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.video-container[b-wsoga0n4d4] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s ease;
}

.video-container:hover[b-wsoga0n4d4] {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.video-info[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.video-title[b-wsoga0n4d4] {
    font-size: 1rem;
    font-weight: 600;
    color: #007bff;
    margin: 0;
}

.video-date[b-wsoga0n4d4] {
    font-size: 0.75rem;
    color: #6c757d;
    margin: 0;
}

.video-wrapper[b-wsoga0n4d4] {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    overflow: hidden;
    border-radius: 8px;
    background-color: #000;
}

.interview-video[b-wsoga0n4d4] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
    object-fit: cover;
    background-color: #000;
}

.video-duration[b-wsoga0n4d4] {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 2;
    background-color: rgba(0, 0, 0, 0.8);
    padding: 4px 8px;
    border-radius: 4px;
}

.duration-badge[b-wsoga0n4d4] {
    background: #343a40;
    color: white;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
}

/* Questions Section */
.questions-card[b-wsoga0n4d4] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.questions-card-header[b-wsoga0n4d4] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.questions-card-title[b-wsoga0n4d4] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.questions-card-content[b-wsoga0n4d4] {
    padding: 24px;
}

.questions-stack[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.question-response-card[b-wsoga0n4d4] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-left: 4px solid #007bff;
    border-radius: 8px;
    padding: 16px;
}

.question-response-content[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.question-text[b-wsoga0n4d4] {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    line-height: 1.4;
    margin: 0;
}

.response-text[b-wsoga0n4d4] {
    font-size: 0.875rem;
    color: #495057;
    line-height: 1.5;
    padding-left: 12px;
    margin: 0;
}

.no-response[b-wsoga0n4d4] {
    font-size: 0.875rem;
    color: #ffc107;
    font-style: italic;
    margin: 0;
}

/* Data Table */
.data-table[b-wsoga0n4d4] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    border: 1px solid #e9ecef;
}

.data-table th[b-wsoga0n4d4] {
    text-align: left;
    padding: 12px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    background: #f8f9fa;
}

.data-table th:last-child[b-wsoga0n4d4] {
    border-right: none;
}

.data-table td[b-wsoga0n4d4] {
    padding: 12px;
    border-bottom: 1px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    vertical-align: middle;
}

.data-table td:last-child[b-wsoga0n4d4] {
    border-right: none;
}

.data-table tr:hover[b-wsoga0n4d4] {
    background: #f8f9fa;
}

.text-center[b-wsoga0n4d4] {
    text-align: center;
}

/* Empty States */
.empty-state[b-wsoga0n4d4] {
    text-align: center;
    padding: 40px 20px;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
}

.empty-state-icon[b-wsoga0n4d4] {
    font-size: 3rem;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-state-message[b-wsoga0n4d4] {
    font-size: 1rem;
    color: #495057;
    margin: 0;
}

/* Back Button */
.back-button-container[b-wsoga0n4d4] {
    margin-top: 24px;
}

/* Responsive Design */
@media (min-width: 992px) {
    .main-grid[b-wsoga0n4d4] {
        grid-template-columns: 2fr 1fr;
        gap: 32px;
    }

    .main-content[b-wsoga0n4d4] {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    .sidebar[b-wsoga0n4d4] {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }
}

@media (max-width: 991px) {
    .main-grid[b-wsoga0n4d4] {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (max-width: 767px) {
    .page-container[b-wsoga0n4d4] {
        padding: 16px;
    }

    .candidate-info-grid[b-wsoga0n4d4] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .videos-grid[b-wsoga0n4d4] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .video-wrapper[b-wsoga0n4d4] {
        padding-bottom: 75%; /* Adjust aspect ratio for mobile */
    }

    .candidate-card-content[b-wsoga0n4d4],
    .videos-card-content[b-wsoga0n4d4],
    .questions-card-content[b-wsoga0n4d4],
    .actions-panel-content[b-wsoga0n4d4] {
        padding: 16px;
    }

    .question-response-card[b-wsoga0n4d4] {
        padding: 12px;
    }

    .btn[b-wsoga0n4d4] {
        padding: 14px 16px;
        font-size: 16px;
        min-height: 52px;
    }
}

@media (max-width: 479px) {
    .page-container[b-wsoga0n4d4] {
        padding: 12px;
    }

    .candidate-card-content[b-wsoga0n4d4],
    .videos-card-content[b-wsoga0n4d4],
    .questions-card-content[b-wsoga0n4d4],
    .actions-panel-content[b-wsoga0n4d4] {
        padding: 12px;
    }

    .video-container[b-wsoga0n4d4] {
        padding: 12px;
    }

    .video-info[b-wsoga0n4d4] {
        gap: 6px;
        margin-bottom: 12px;
    }
}

/* Video subtitle styles */
.video-subtitle[b-wsoga0n4d4] {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 4px 0 0 0;
    font-weight: 500;
}

/* Video List Styles */
.videos-list[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.video-list-item[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.video-list-info[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
}

.video-list-icon[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #007bff;
    color: white;
    border-radius: 50%;
    flex-shrink: 0;
}

.video-list-details[b-wsoga0n4d4] {
    flex: 1;
}

.video-list-title[b-wsoga0n4d4] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 8px 0;
}

.video-list-meta[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.video-phase-badge[b-wsoga0n4d4] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    background: #dbeafe;
    color: #1e40af;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 400;
}

.video-list-date[b-wsoga0n4d4],
.video-list-duration[b-wsoga0n4d4] {
    font-size: 0.875rem;
    color: #6b7280;
}

.video-review-indicator[b-wsoga0n4d4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
}

.video-review-indicator.positive[b-wsoga0n4d4] {
    background: #d1fae5;
    color: #065f46;
}

.video-review-indicator.negative[b-wsoga0n4d4] {
    background: #fee2e2;
    color: #991b1b;
}

.video-review-indicator svg[b-wsoga0n4d4] {
    flex-shrink: 0;
}

.video-comment-indicator[b-wsoga0n4d4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.75rem;
    color: #6b7280;
    font-weight: 500;
}

.video-comment-indicator svg[b-wsoga0n4d4] {
    flex-shrink: 0;
}

.btn-watch-video[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.btn-watch-video:hover[b-wsoga0n4d4] {
    background: #0056b3;
    transform: translateX(2px);
}

/* Video Modal Styles */
.video-modal-overlay[b-wsoga0n4d4] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
    animation: fadeIn-b-wsoga0n4d4 0.2s ease;
}

@keyframes fadeIn-b-wsoga0n4d4 {
    from { opacity: 0; }
    to { opacity: 1; }
}

.video-modal-content[b-wsoga0n4d4] {
    background: white;
    border-radius: 12px;
    width: 100%;
    max-width: 1200px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-wsoga0n4d4 0.3s ease;
}

@keyframes slideUp-b-wsoga0n4d4 {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.video-modal-header[b-wsoga0n4d4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    gap: 16px;
}

.video-modal-navigation[b-wsoga0n4d4] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.video-nav-btn[b-wsoga0n4d4] {
    background: #10b981;
    border: 1px solid #059669;
    border-radius: 6px;
    padding: 8px 16px;
    cursor: pointer;
    color: white;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 0.875rem;
    font-weight: 500;
}

.video-nav-btn:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #059669;
    border-color: #047857;
    color: white;
}

.video-nav-btn:disabled[b-wsoga0n4d4] {
    opacity: 0.4;
    cursor: not-allowed;
}

.video-modal-title-section[b-wsoga0n4d4] {
    flex: 1;
    min-width: 0;
}

.video-modal-title[b-wsoga0n4d4] {
    font-size: 0.9375rem;
    font-weight: 400;
    color: #1f2937;
    margin: 0 0 8px 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
    line-height: 1.4;
    hyphens: auto;
}

.video-modal-meta[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.video-modal-date[b-wsoga0n4d4] {
    font-size: 0.875rem;
    color: #6b7280;
}

.video-modal-counter[b-wsoga0n4d4] {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 400;
}

.video-modal-close[b-wsoga0n4d4] {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: #6b7280;
    border-radius: 4px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    margin-left: 16px;
}

.video-modal-close:hover[b-wsoga0n4d4] {
    background: #f3f4f6;
    color: #1f2937;
}

.video-modal-body[b-wsoga0n4d4] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.modal-video-player[b-wsoga0n4d4] {
    width: 800px;
    height: 450px;
    max-width: 100%;
    background: #000;
    border-radius: 8px;
    object-fit: contain;
    margin: 0 auto;
}

.video-loading-placeholder[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 800px;
    height: 450px;
    max-width: 100%;
    background: #f8f9fa;
    border-radius: 8px;
    gap: 16px;
    margin: 0 auto;
}

.video-loading-placeholder .loading-spinner[b-wsoga0n4d4] {
    width: 48px;
    height: 48px;
    border: 4px solid #e9ecef;
    border-top: 4px solid #007bff;
}

.video-loading-placeholder p[b-wsoga0n4d4] {
    margin: 0;
    font-size: 1rem;
    color: #6c757d;
    font-weight: 500;
}

.video-modal-info[b-wsoga0n4d4] {
    margin-top: 16px;
    padding: 12px 16px;
    background: #f9fafb;
    border-radius: 6px;
    text-align: center;
    width: 800px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    font-size: 0.875rem;
    color: #6b7280;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .video-list-item[b-wsoga0n4d4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .video-list-info[b-wsoga0n4d4] {
        width: 100%;
    }

    .btn-watch-video[b-wsoga0n4d4] {
        width: 100%;
        justify-content: center;
    }

    .video-modal-overlay[b-wsoga0n4d4] {
        padding: 0;
    }

    .video-modal-content[b-wsoga0n4d4] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }

    .video-modal-header[b-wsoga0n4d4] {
        padding: 16px;
        gap: 12px;
    }

    .video-modal-navigation[b-wsoga0n4d4] {
        gap: 6px;
    }

    .video-nav-btn[b-wsoga0n4d4] {
        padding: 6px 10px;
    }

    .video-modal-title[b-wsoga0n4d4] {
        font-size: 1rem;
        line-height: 1.5;
    }

    .video-modal-title-section[b-wsoga0n4d4] {
        min-width: 0;
        overflow: hidden;
    }

    .video-modal-body[b-wsoga0n4d4] {
        padding: 16px;
    }

    .modal-video-player[b-wsoga0n4d4] {
        width: 100%;
        height: auto;
        max-height: 50vh;
    }

    .video-loading-placeholder[b-wsoga0n4d4] {
        width: 100%;
        height: auto;
        min-height: 300px;
    }
}

/*  video review section */

.video-review-section[b-wsoga0n4d4] {
    margin-top: 24px;
    padding: 24px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    box-sizing: border-box;
    overflow: auto;
    width: 100%;
    align-self: stretch;
}

.review-section-title[b-wsoga0n4d4] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 20px 0;
}

/* Thumbs Up/Down Buttons */
.review-rating-buttons[b-wsoga0n4d4] {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

.btn-thumb[b-wsoga0n4d4] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    background: white;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #6b7280;
    transition: all 0.2s ease;
}

.btn-thumb:hover:not(:disabled)[b-wsoga0n4d4] {
    border-color: #d1d5db;
    background: #f9fafb;
}

.btn-thumb:disabled[b-wsoga0n4d4] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-thumb.active.positive[b-wsoga0n4d4] {
    background: #10b981;
    border-color: #10b981;
    color: white;
}

.btn-thumb.active.negative[b-wsoga0n4d4] {
    background: #ef4444;
    border-color: #ef4444;
    color: white;
}

.btn-thumb svg[b-wsoga0n4d4] {
    flex-shrink: 0;
}

/* Comment Textarea */
.review-comment-container[b-wsoga0n4d4] {
    margin-bottom: 16px;
    width: 100%;
    box-sizing: border-box;
}

.review-comment-textarea[b-wsoga0n4d4] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 0.9375rem;
    font-family: inherit;
    line-height: 1.5;
    color: #111827;
    background: white;
    resize: vertical;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.review-comment-textarea:focus[b-wsoga0n4d4] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.review-comment-textarea:disabled[b-wsoga0n4d4] {
    background: #f3f4f6;
    cursor: not-allowed;
}

.review-comment-container .character-counter[b-wsoga0n4d4] {
    margin-top: 6px;
    font-size: 0.75rem;
    color: #9ca3af;
    text-align: right;
}

/* Save Review Button */
.btn-save-review[b-wsoga0n4d4] {
    width: 100%;
    padding: 12px 24px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-save-review:hover:not(:disabled)[b-wsoga0n4d4] {
    background: #0056b3;
}

.btn-save-review:disabled[b-wsoga0n4d4] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Reviews List */
.video-reviews-list[b-wsoga0n4d4] {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}

.reviews-list-title[b-wsoga0n4d4] {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 16px 0;
}

.review-item[b-wsoga0n4d4] {
    background: white;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    margin-bottom: 12px;
}

.review-item:last-child[b-wsoga0n4d4] {
    margin-bottom: 0;
}

.review-header[b-wsoga0n4d4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.review-author[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.review-author strong[b-wsoga0n4d4] {
    font-size: 0.9375rem;
    color: #111827;
}

.review-badge[b-wsoga0n4d4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8125rem;
    font-weight: 500;
}

.review-badge.positive[b-wsoga0n4d4] {
    background: #d1fae5;
    color: #065f46;
}

.review-badge.negative[b-wsoga0n4d4] {
    background: #fee2e2;
    color: #991b1b;
}

.review-date[b-wsoga0n4d4] {
    font-size: 0.8125rem;
    color: #9ca3af;
}

.review-comment[b-wsoga0n4d4] {
    margin: 8px 0 0 0;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: #4b5563;
}

/* Mobile Responsive for Reviews */
@media (max-width: 768px) {
    .review-rating-buttons[b-wsoga0n4d4] {
        flex-direction: column;
    }

    .btn-thumb[b-wsoga0n4d4] {
        width: 100%;
    }

    .review-header[b-wsoga0n4d4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .video-review-section[b-wsoga0n4d4] {
        padding: 16px;
    }
}

/* Redo Interview Message Options */
.redo-message-options[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.message-option[b-wsoga0n4d4] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.radio-option[b-wsoga0n4d4] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 500;
    color: #374151;
}

.radio-option input[type="radio"][b-wsoga0n4d4] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #007bff;
}

.radio-label[b-wsoga0n4d4] {
    font-size: 0.9375rem;
    user-select: none;
}

.default-message-preview[b-wsoga0n4d4] {
    margin-left: 26px;
    padding: 12px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.875rem;
    color: #6c757d;
    line-height: 1.5;
}

.custom-message-input[b-wsoga0n4d4] {
    margin-left: 26px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.custom-message-input textarea[b-wsoga0n4d4] {
    width: 100%;
    resize: vertical;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Clients/ClientPositions.razor.rz.scp.css */
/* ClientPositions.razor.css - Blazor CSS Isolation */

/* Page Layout */
.page-container[b-pe6dyhazwx] {
    padding: 16px;
    max-width: 100%;
    width: 100%;
    margin: 0;
}

/* Breadcrumbs */
.breadcrumbs[b-pe6dyhazwx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    padding: 8px 0;
}

.breadcrumb-item[b-pe6dyhazwx] {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
}

.breadcrumb-item:hover:not(.disabled)[b-pe6dyhazwx] {
    color: #007bff;
}

.breadcrumb-item.disabled[b-pe6dyhazwx] {
    color: #adb5bd;
    cursor: default;
}

.breadcrumb-separator[b-pe6dyhazwx] {
    color: #adb5bd;
    margin: 0 4px;
}

/* Client Header Card */
.client-header[b-pe6dyhazwx] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 24px;
    margin-bottom: 24px;
}

.client-header-content[b-pe6dyhazwx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.client-info h1[b-pe6dyhazwx] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.client-contact[b-pe6dyhazwx] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

.client-actions[b-pe6dyhazwx] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Status Badge */
.status-badge[b-pe6dyhazwx] {
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    color: white;
}

.status-badge.active[b-pe6dyhazwx] {
    background: #28a745;
}

.status-badge.inactive[b-pe6dyhazwx] {
    background: #ffc107;
    color: #212529;
}

.status-badge.suspended[b-pe6dyhazwx] {
    background: #dc3545;
}

/* Stats Grid */
.stats-grid[b-pe6dyhazwx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.stat-card[b-pe6dyhazwx] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    text-align: center;
}

.stat-label[b-pe6dyhazwx] {
    font-size: 14px;
    font-weight: 500;
    color: #6c757d;
    margin-bottom: 8px;
}

.stat-value[b-pe6dyhazwx] {
    font-size: 2rem;
    font-weight: 600;
    margin: 0;
}

.stat-value.primary[b-pe6dyhazwx] {
    color: #007bff;
}

.stat-value.success[b-pe6dyhazwx] {
    color: #28a745;
}

.stat-value.info[b-pe6dyhazwx] {
    color: #17a2b8;
}

.stat-value.warning[b-pe6dyhazwx] {
    color: #ffc107;
}

/* Button Styles */
.btn[b-pe6dyhazwx] {
    padding: 10px 16px;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
}

.btn:disabled[b-pe6dyhazwx] {
    opacity: 0.5;
    cursor: not-allowed !important;
}

.btn-primary[b-pe6dyhazwx] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-pe6dyhazwx] {
    background: #0056b3;
}

.btn-secondary[b-pe6dyhazwx] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-pe6dyhazwx] {
    background: #545b62;
}

.btn-outline[b-pe6dyhazwx] {
    background: transparent;
    border: 1px solid #007bff;
    color: #007bff;
}

.btn-outline:hover:not(:disabled)[b-pe6dyhazwx] {
    background: #007bff;
    color: white;
}

/* Positions Table Card */
.positions-card[b-pe6dyhazwx] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.positions-card-header[b-pe6dyhazwx] {
    background: #f8f9fa;
    padding: 16px 24px;
    border-bottom: 1px solid #dee2e6;
}

.positions-card-title[b-pe6dyhazwx] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.positions-card-content[b-pe6dyhazwx] {
    padding: 0;
}

/* Data Table */
.data-table[b-pe6dyhazwx] {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

.data-table th[b-pe6dyhazwx] {
    background: #f8f9fa;
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #dee2e6;
    border-right: 1px solid #dee2e6;
}

.data-table th:last-child[b-pe6dyhazwx] {
    border-right: none;
}

.data-table td[b-pe6dyhazwx] {
    padding: 12px 16px;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    vertical-align: middle;
}

.data-table td:last-child[b-pe6dyhazwx] {
    border-right: none;
}

.data-table tr:hover[b-pe6dyhazwx] {
    background: #f8f9fa;
}

/* Loading State */
.loading-container[b-pe6dyhazwx] {
    padding: 60px 20px;
    text-align: center;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-pe6dyhazwx] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-pe6dyhazwx 1s linear infinite;
    margin: 0 auto 16px;
}

@keyframes spin-b-pe6dyhazwx {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-pe6dyhazwx] {
    font-size: 18px;
    font-weight: 500;
    color: #495057;
}

/* Position Link */
.position-link[b-pe6dyhazwx] {
    color: #007bff;
    text-decoration: none;
    font-weight: 500;
}

.position-link:hover[b-pe6dyhazwx] {
    color: #0056b3;
    text-decoration: underline;
}

/* Badge */
.badge[b-pe6dyhazwx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
    color: white;
    min-width: 24px;
}

.badge-info[b-pe6dyhazwx] {
    background: #17a2b8;
}

.badge-success[b-pe6dyhazwx] {
    background: #28a745;
}

.badge-warning[b-pe6dyhazwx] {
    background: #ffc107;
    color: #212529;
}

.badge-danger[b-pe6dyhazwx] {
    background: #dc3545;
}

.badge-secondary[b-pe6dyhazwx] {
    background: #6c757d;
}

/* Actions Dropdown */
.actions-dropdown[b-pe6dyhazwx] {
    position: relative;
}

.actions-select[b-pe6dyhazwx] {
    padding: 6px 24px 6px 8px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    background: white;
    font-size: 12px;
    color: #495057;
    cursor: pointer;
    appearance: none;
    min-width: 100px;
}

.actions-select:focus[b-pe6dyhazwx] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.actions-arrow[b-pe6dyhazwx] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #6c757d;
    font-size: 10px;
}

/* Empty State */
.empty-state[b-pe6dyhazwx] {
    padding: 64px 32px;
    text-align: center;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-top: 24px;
}

.empty-state-icon[b-pe6dyhazwx] {
    font-size: 64px;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-state-title[b-pe6dyhazwx] {
    font-size: 24px;
    font-weight: 600;
    color: #495057;
    margin-bottom: 8px;
}

.empty-state-message[b-pe6dyhazwx] {
    font-size: 16px;
    color: #6c757d;
    margin-bottom: 24px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-container[b-pe6dyhazwx] {
        padding: 8px;
        margin: 0 auto;
    }

    .client-header-content[b-pe6dyhazwx] {
        flex-direction: column;
        align-items: flex-start;
    }

    .client-actions[b-pe6dyhazwx] {
        width: 100%;
        justify-content: flex-start;
    }

    .stats-grid[b-pe6dyhazwx] {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 12px;
    }

    .action-bar-content[b-pe6dyhazwx] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-field[b-pe6dyhazwx] {
        min-width: unset;
        max-width: none;
        width: 100%;
    }

    .search-field input[b-pe6dyhazwx] {
        font-size: 16px;
        padding: 10px 12px 10px 36px;
    }

    .search-field .input-icon[b-pe6dyhazwx] {
        left: 10px;
        font-size: 14px;
    }

    .action-controls[b-pe6dyhazwx] {
        justify-content: flex-start;
        width: 100%;
    }

    .select-container[b-pe6dyhazwx] {
        width: 100%;
        min-width: unset;
    }

    .btn[b-pe6dyhazwx] {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .stats-grid[b-pe6dyhazwx] {
        grid-template-columns: 1fr 1fr;
    }

    .stat-card[b-pe6dyhazwx] {
        padding: 16px;
    }

    .client-header[b-pe6dyhazwx] {
        padding: 16px;
    }

    .action-bar[b-pe6dyhazwx] {
        padding: 12px;
    }

    .search-field input[b-pe6dyhazwx] {
        font-size: 14px;
        padding: 8px 10px 8px 32px;
    }

    .client-info h1[b-pe6dyhazwx] {
        font-size: 1.5rem;
    }

    .client-contact[b-pe6dyhazwx] {
        font-size: 0.875rem;
    }
}

/* Table Responsive */
@media (max-width: 992px) {
    .data-table[b-pe6dyhazwx] {
        font-size: 14px;
    }

    .data-table th[b-pe6dyhazwx],
    .data-table td[b-pe6dyhazwx] {
        padding: 8px 12px;
    }
}

@media (max-width: 768px) {
    .hide-mobile[b-pe6dyhazwx] {
        display: none !important;
    }
}

@media (max-width: 576px) {
    .hide-xs[b-pe6dyhazwx] {
        display: none !important;
    }

    .data-table th[b-pe6dyhazwx],
    .data-table td[b-pe6dyhazwx] {
        padding: 8px;
        font-size: 12px;
    }

    /* Show abbreviated actions header on mobile */
    .actions-text-full[b-pe6dyhazwx] {
        display: none;
    }

    .actions-text-mobile[b-pe6dyhazwx] {
        display: inline;
        font-size: 18px;
        letter-spacing: 2px;
    }

    /* Tighter action button spacing on mobile */
    .action-buttons[b-pe6dyhazwx] {
        gap: 8px !important;
    }

    .action-btn[b-pe6dyhazwx] {
        min-width: 32px !important;
        min-height: 32px !important;
        padding: 6px !important;
    }
}

/* Utility Classes */
.text-center[b-pe6dyhazwx] {
    text-align: center;
}

.mb-4[b-pe6dyhazwx] {
    margin-bottom: 24px;
}

.mt-4[b-pe6dyhazwx] {
    margin-top: 24px;
}

.d-flex[b-pe6dyhazwx] {
    display: flex;
}

.align-items-center[b-pe6dyhazwx] {
    align-items: center;
}

.justify-content-between[b-pe6dyhazwx] {
    justify-content: space-between;
}

.gap-2[b-pe6dyhazwx] {
    gap: 8px;
}

.gap-3[b-pe6dyhazwx] {
    gap: 12px;
}

/* Actions Header */
.actions-header[b-pe6dyhazwx] {
    white-space: nowrap;
}

.actions-text-mobile[b-pe6dyhazwx] {
    display: none;
}

.actions-text-full[b-pe6dyhazwx] {
    display: inline;
}

/* Action buttons styles imported from ActionButtons.razor.css */


/* Modal Overlay and Container */
.modal-overlay[b-pe6dyhazwx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 20px;
    animation: fadeIn-b-pe6dyhazwx 0.2s ease-out;
}

@keyframes fadeIn-b-pe6dyhazwx {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.modal-container[b-pe6dyhazwx] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-pe6dyhazwx 0.3s ease-out;
}

@keyframes slideUp-b-pe6dyhazwx {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Modal Header */
.modal-header[b-pe6dyhazwx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 24px 16px;
    border-bottom: 1px solid #e9ecef;
}

.modal-header h2[b-pe6dyhazwx] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
}

.modal-close[b-pe6dyhazwx] {
    background: none;
    border: none;
    font-size: 28px;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.modal-close:hover[b-pe6dyhazwx] {
    background: #f8f9fa;
    color: #212529;
}

/* Modal Body */
.modal-body[b-pe6dyhazwx] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Form Elements in Modal */
.form-group[b-pe6dyhazwx] {
    margin-bottom: 20px;
}

.form-group label[b-pe6dyhazwx] {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #495057;
    font-size: 14px;
}

.form-control[b-pe6dyhazwx] {
    width: 100%;
    padding: 10px 14px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
}

.form-control:focus[b-pe6dyhazwx] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-control:hover:not(:focus)[b-pe6dyhazwx] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-control[b-pe6dyhazwx]::placeholder {
    color: #6b7280;
    opacity: 1;
}

textarea.form-control[b-pe6dyhazwx] {
    resize: vertical;
    min-height: 80px;
}

.form-row[b-pe6dyhazwx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Modal Footer */
.modal-footer[b-pe6dyhazwx] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    padding: 16px 24px 24px;
    border-top: 1px solid #e9ecef;
}

/* Responsive Modal */
@media (max-width: 640px) {
    .modal-overlay[b-pe6dyhazwx] {
        padding: 0;
        align-items: flex-end;
    }

    .modal-container[b-pe6dyhazwx] {
        max-height: 95vh;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        animation: slideUpMobile-b-pe6dyhazwx 0.3s ease-out;
    }

    @keyframes slideUpMobile-b-pe6dyhazwx {
        from {
            transform: translateY(100%);
        }
        to {
            transform: translateY(0);
        }
    }

    .form-row[b-pe6dyhazwx] {
        grid-template-columns: 1fr;
    }

    .modal-header[b-pe6dyhazwx] {
        padding: 20px 16px 12px;
    }

    .modal-body[b-pe6dyhazwx] {
        padding: 16px;
    }

    .modal-footer[b-pe6dyhazwx] {
        padding: 12px 16px 20px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Clients/ClientsList.razor.rz.scp.css */
/* ClientsList.razor.css - Blazor CSS Isolation */

/* Page Layout */
.page-container[b-2cn2q5y4kl] {
    padding: 16px;
    max-width: none;
    width: 100%;
    margin: 0;
}

.loading-container[b-2cn2q5y4kl], .auth-error[b-2cn2q5y4kl] {
    padding: 60px 20px;
    text-align: center;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 16px;
}

.loading-spinner[b-2cn2q5y4kl] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-2cn2q5y4kl 1s linear infinite;
    margin: 0 auto 16px;
}

@keyframes spin-b-2cn2q5y4kl {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-2cn2q5y4kl], .auth-error-title[b-2cn2q5y4kl] {
    font-size: 18px;
    font-weight: 500;
    color: #495057;
    margin: 0;
}

.auth-error-icon[b-2cn2q5y4kl] {
    font-size: 48px;
    margin-bottom: 16px;
}

/* Breadcrumb styles imported from Breadcrumb.razor.css */

/* Page Title */
.page-title[b-2cn2q5y4kl] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin-bottom: 1.5rem;
}

/* Paper Component */
.paper[b-2cn2q5y4kl] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 16px;
    box-sizing: border-box;
    width: 100%;
}

/* Switch Component */
.switch-container[b-2cn2q5y4kl] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
}

.switch[b-2cn2q5y4kl] {
    position: relative;
    width: 44px;
    height: 24px;
    background: #ccc;
    border-radius: 12px;
    transition: background 0.2s ease;
}

.switch.checked[b-2cn2q5y4kl] {
    background: #007bff;
}

.switch-slider[b-2cn2q5y4kl] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background: white;
    border-radius: 50%;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.switch.checked .switch-slider[b-2cn2q5y4kl] {
    transform: translateX(20px);
}

.switch-label[b-2cn2q5y4kl] {
    font-size: 14px;
    color: #495057;
}

/* Data Table */
.data-table[b-2cn2q5y4kl] {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.data-table th[b-2cn2q5y4kl] {
    background: #f8f9fa;
    padding: 12px;
    text-align: left;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #d1d5db;
    border-right: 1px solid #dee2e6;
}

.data-table th:last-child[b-2cn2q5y4kl] {
    border-right: none;
}

.data-table td[b-2cn2q5y4kl] {
    padding: 10px 12px;
    border-bottom: 1px solid #d1d5db;
    border-right: 1px solid #dee2e6;
    vertical-align: middle;
    text-align: center;
}

.data-table td:last-child[b-2cn2q5y4kl] {
    border-right: none;
}

.data-table td.text-center[b-2cn2q5y4kl] {
    text-align: center;
}

.cell-content[b-2cn2q5y4kl] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    line-height: 1.4;
}

.cell-content-center[b-2cn2q5y4kl] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
}

.data-table tr:hover[b-2cn2q5y4kl] {
    background: #f8f9fa;
}

/* Company Info */
.company-info[b-2cn2q5y4kl] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.company-name[b-2cn2q5y4kl] {
    font-weight: 600;
    color: #ff6600;
    margin: 0;
    font-size: 14px;
    line-height: 1.3;
    white-space: normal;
    word-break: break-word;
}

.contact-name[b-2cn2q5y4kl] {
    font-size: 12px;
    color: #6c757d;
    margin: 0;
    line-height: 1.3;
    white-space: nowrap;
}

.mobile-extra-info[b-2cn2q5y4kl] {
    display: none;
    margin-top: 8px;
}

.mobile-extra-info p[b-2cn2q5y4kl] {
    margin: 2px 0;
    font-size: 12px;
    color: #6c757d;
}

/* Badge */
.data-table .badge[b-2cn2q5y4kl],
.data-table span.badge[b-2cn2q5y4kl],
span.badge.badge-info[b-2cn2q5y4kl],
.badge[b-2cn2q5y4kl] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 50% !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: white !important;
    background: #17a2b8 !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    line-height: 1 !important;
    text-align: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

.data-table .badge.badge-info[b-2cn2q5y4kl],
.data-table span.badge-info[b-2cn2q5y4kl],
span.badge.badge-info[b-2cn2q5y4kl],
.badge.badge-info[b-2cn2q5y4kl] {
    background: #dc3545 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 32px !important;
    height: 32px !important;
}

.data-table .badge.badge-warning[b-2cn2q5y4kl],
.data-table span.badge-warning[b-2cn2q5y4kl],
span.badge.badge-warning[b-2cn2q5y4kl],
.badge.badge-warning[b-2cn2q5y4kl] {
    background: #ffc107 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 32px !important;
    height: 32px !important;
}

.data-table .badge.badge-success[b-2cn2q5y4kl],
.data-table span.badge-success[b-2cn2q5y4kl],
span.badge.badge-success[b-2cn2q5y4kl],
.badge.badge-success[b-2cn2q5y4kl] {
    background: #28a745 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 32px !important;
    height: 32px !important;
}

/* Utility Classes */
.text-center[b-2cn2q5y4kl] {
    text-align: center;
}

/* Responsive Visibility */
@media (max-width: 767px) {
    .hide-mobile[b-2cn2q5y4kl] {
        display: none !important;
    }

    .mobile-extra-info[b-2cn2q5y4kl] {
        display: block;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .tablet-hide[b-2cn2q5y4kl] {
        display: none !important;
    }
}

/* Empty State */
.empty-state[b-2cn2q5y4kl] {
    padding: 64px 32px;
    text-align: center;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.empty-state-icon[b-2cn2q5y4kl] {
    font-size: 64px;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-state-title[b-2cn2q5y4kl] {
    font-size: 24px;
    font-weight: 600;
    color: #495057;
    margin-bottom: 8px;
}

.empty-state-message[b-2cn2q5y4kl] {
    font-size: 16px;
    color: #6c757d;
    margin: 0;
}

/* Mobile Card View */
.mobile-card-view[b-2cn2q5y4kl] {
    display: none;
}

@media (max-width: 480px) {
    .desktop-table-container[b-2cn2q5y4kl] {
        display: none;
    }

    .mobile-card-view[b-2cn2q5y4kl] {
        display: block;
    }
}

.client-card[b-2cn2q5y4kl] {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
    margin-left: auto;
    margin-right: auto;
    background: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    max-width: 600px;
}

.client-card-header[b-2cn2q5y4kl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.client-card-title[b-2cn2q5y4kl] {
    font-size: 18px;
    font-weight: 600;
    color: #ff6600;
    margin: 0 0 4px 0;
}

.client-card-subtitle[b-2cn2q5y4kl] {
    font-size: 12px;
    color: #6c757d;
    margin: 0;
}

.client-card-info[b-2cn2q5y4kl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.client-card-info-item[b-2cn2q5y4kl] {
    display: flex;
    flex-direction: column;
    padding: 8px;
    border: 1px solid #f0f0f0;
    border-radius: 4px;
    background: #fafafa;
}

.client-card-info-label[b-2cn2q5y4kl] {
    font-size: 12px;
    color: #6c757d;
    margin-bottom: 4px;
}

.client-card-info-value[b-2cn2q5y4kl] {
    font-size: 14px;
    color: #212529;
    font-weight: 500;
}

.client-card-bottom[b-2cn2q5y4kl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
}

.client-card-bottom .client-card-info-item[b-2cn2q5y4kl] {
    flex: 1 1 0;
    min-width: 0;
}

.client-card-actions[b-2cn2q5y4kl] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex: 1 1 0;
    min-width: 0;
}

.client-card-actions .action-buttons[b-2cn2q5y4kl] {
    display: flex;
    gap: 8px;
}

.client-card-actions .action-btn[b-2cn2q5y4kl] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 8px !important;
    min-height: 32px !important;
    min-width: 32px !important;
    font-size: 0 !important;
    background: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
}

.client-card-actions .action-btn svg[b-2cn2q5y4kl] {
    width: 18px !important;
    height: 18px !important;
}

.client-card-actions .action-btn-text[b-2cn2q5y4kl] {
    display: none !important;
}

.client-card-actions .action-btn.view-btn:hover[b-2cn2q5y4kl] {
    background: #007bff !important;
    color: white !important;
    border-color: #007bff !important;
}

.client-card-actions .action-btn.edit-btn:hover[b-2cn2q5y4kl] {
    background: #28a745 !important;
    color: white !important;
    border-color: #28a745 !important;
}

.client-card-actions .action-btn.delete-btn:hover[b-2cn2q5y4kl] {
    background: #dc3545 !important;
    color: white !important;
    border-color: #dc3545 !important;
}

/* Actions Header */
.actions-header[b-2cn2q5y4kl] {
    white-space: nowrap;
}

.actions-text-mobile[b-2cn2q5y4kl] {
    display: none;
}

.actions-text-full[b-2cn2q5y4kl] {
    display: inline;
}

/* Action buttons styles imported from ActionButtons.razor.css */

/* Actions Column Width */
.actions-column[b-2cn2q5y4kl] {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    padding: 16px 20px !important;
}

.mobile-actions-column[b-2cn2q5y4kl] {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    padding: 16px 20px !important;
}

/* Center All Table Headings */
.data-table th[b-2cn2q5y4kl] {
    text-align: center !important;
}

/* Filter styles imported from DynamicFilterPanel.razor.css */

@media (max-width: 768px) {
    .page-header h1[b-2cn2q5y4kl] {
        font-size: 1.75rem;
    }
}

@media (max-width: 576px) {
    /* Show abbreviated actions header on mobile */
    .actions-text-full[b-2cn2q5y4kl] {
        display: none;
    }

    .actions-text-mobile[b-2cn2q5y4kl] {
        display: inline;
        font-size: 18px;
        letter-spacing: 2px;
    }

    /* Hide badge text on mobile */
    .badge-text-full[b-2cn2q5y4kl] {
        display: none;
    }

    /* Tighter action button spacing on mobile */
    .action-buttons[b-2cn2q5y4kl] {
        gap: 8px !important;
    }

    .action-btn[b-2cn2q5y4kl] {
        min-width: 32px !important;
        min-height: 32px !important;
        padding: 6px !important;
    }

    /* Adjust actions column width on mobile */
    .actions-column[b-2cn2q5y4kl],
    .mobile-actions-column[b-2cn2q5y4kl] {
        width: 120px !important;
        min-width: 120px !important;
        max-width: 120px !important;
        padding: 8px !important;
    }

    .page-container[b-2cn2q5y4kl] {
        padding: 12px;
        margin: 0 auto;
    }
}

@media (max-width: 576px) {
    /* Better mobile layout */
    .client-card[b-2cn2q5y4kl] {
        max-width: 100%;
        padding: 14px;
    }

    .client-card-bottom[b-2cn2q5y4kl] {
        gap: 10px;
    }

    .client-card-bottom .client-card-info-item[b-2cn2q5y4kl] {
        max-width: 120px;
        font-size: 13px;
    }

    .client-card-info-label[b-2cn2q5y4kl] {
        font-size: 11px;
    }

    .client-card-info-value[b-2cn2q5y4kl] {
        font-size: 13px;
    }

    .client-card-actions .action-btn[b-2cn2q5y4kl] {
        min-width: 36px !important;
        min-height: 36px !important;
        padding: 8px !important;
    }

    .client-card-actions .action-btn svg[b-2cn2q5y4kl] {
        width: 16px !important;
        height: 16px !important;
    }
}

@media (max-width: 400px) {
    /* Stack on very small screens */
    .client-card-bottom[b-2cn2q5y4kl] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .client-card-bottom .client-card-info-item[b-2cn2q5y4kl] {
        max-width: 100%;
    }

    .client-card-actions[b-2cn2q5y4kl] {
        width: 100%;
        justify-content: flex-start;
    }
}

/* Contact Info Column */
.contact-column[b-2cn2q5y4kl] {
    width: 450px;
    padding: 12px 16px !important;
    text-align: center !important;
}

.contact-info-cell[b-2cn2q5y4kl] {
    display: flex;
    flex-direction: row;
    gap: 20px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.contact-item[b-2cn2q5y4kl] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #495057;
    white-space: nowrap;
}

.contact-icon[b-2cn2q5y4kl] {
    font-size: 14px;
    color: #6c757d;
    min-width: 16px;
}

/* Active Status Column */
.active-column[b-2cn2q5y4kl] {
    width: 100px;
}

/* Active/Inactive Status Badges */
[b-2cn2q5y4kl] .status-badge.active {
    background: #10b981 !important;
    color: #ffffff !important;
    border: 1px solid #059669 !important;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(16, 185, 129, 0.3);
}

[b-2cn2q5y4kl] .status-badge.inactive {
    background: #ef4444 !important;
    color: #ffffff !important;
    border: 1px solid #dc2626 !important;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(239, 68, 68, 0.3);
}

/* Company Column - Narrower */
.company-column[b-2cn2q5y4kl] {
    width: 250px;
    max-width: 250px;
    text-align: center !important;
    padding: 10px 12px !important;
}

.mobile-company-column[b-2cn2q5y4kl] {
    width: auto;
    min-width: 200px;
    text-align: center !important;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Clients/PositionDetails.razor.rz.scp.css */
/* PositionDetails.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-re0z34hmn5] {
    padding: 24px;
    max-width: 1600px;
    margin: 0 auto;
}

/* Loading State */
.loading-container[b-re0z34hmn5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.loading-spinner[b-re0z34hmn5] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-re0z34hmn5 1s linear infinite;
}

.loading-text[b-re0z34hmn5] {
    margin-top: 16px;
    font-size: 14px;
    color: #6c757d;
}

@keyframes spin-b-re0z34hmn5 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Breadcrumb styles imported from Breadcrumb.razor.css */

/* Position Header */
.position-header[b-re0z34hmn5] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
    padding: 24px;
}

.position-header-content[b-re0z34hmn5] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
}

.position-info h1[b-re0z34hmn5] {
    margin: 0 0 8px 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: #212529;
}

.position-meta[b-re0z34hmn5] {
    margin: 0 0 12px 0;
    font-size: 14px;
    color: #6c757d;
}

.position-description[b-re0z34hmn5] {
    margin: 0;
    font-size: 14px;
    color: #495057;
    line-height: 1.5;
}

.position-actions[b-re0z34hmn5] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Buttons */
.btn[b-re0z34hmn5] {
    padding: 10px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn-warning[b-re0z34hmn5] {
    background: #ffc107;
    color: #212529;
}

.btn-warning:hover:not(:disabled)[b-re0z34hmn5] {
    background: #e0a800;
}

.btn-info[b-re0z34hmn5] {
    background: #17a2b8;
    color: white;
}

.btn-info:hover:not(:disabled)[b-re0z34hmn5] {
    background: #138496;
}

.btn-primary[b-re0z34hmn5] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-re0z34hmn5] {
    background: #0056b3;
}

.btn-secondary[b-re0z34hmn5] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-re0z34hmn5] {
    background: #5a6268;
}

.btn:disabled[b-re0z34hmn5] {
    opacity: 0.5;
    cursor: not-allowed !important;
}

.btn-outline[b-re0z34hmn5] {
    background: transparent;
    color: #007bff;
    border: 1px solid #007bff;
}

.btn-outline:hover[b-re0z34hmn5] {
    background: #007bff;
    color: white;
}

.btn-sm[b-re0z34hmn5] {
    padding: 6px 12px;
    font-size: 12px;
    min-height: 32px;
}

/* Candidates Card */
.candidates-card[b-re0z34hmn5] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.candidates-card-header[b-re0z34hmn5] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

/* Tabs Navigation */
.tabs-navigation[b-re0z34hmn5] {
    display: flex;
    gap: 4px;
    flex: 1;
}

.tab-btn[b-re0z34hmn5] {
    padding: 12px 24px;
    border: none;
    background: #f8f9fa;
    color: #495057;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 8px 8px 0 0;
    transition: all 0.2s ease;
    margin-right: 4px;
    position: relative;
}

.tab-btn:hover:not(:disabled)[b-re0z34hmn5] {
    color: #007bff;
    background: #e7f1ff;
}

.tab-btn.active[b-re0z34hmn5] {
    color: #007bff;
    background: white;
    font-weight: 600;
    box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.05);
}

.tab-btn.active[b-re0z34hmn5]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: #007bff;
}

.tab-btn:disabled[b-re0z34hmn5] {
    color: #adb5bd;
    cursor: not-allowed;
    opacity: 0.6;
    background: #e9ecef;
}

.candidates-actions[b-re0z34hmn5] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.candidates-card-title[b-re0z34hmn5] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

.candidates-card-content[b-re0z34hmn5] {
    padding: 24px;
}

/* Data Table */
.data-table[b-re0z34hmn5] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    border: 1px solid #e9ecef;
}

.data-table th[b-re0z34hmn5] {
    text-align: left;
    padding: 12px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    background: #f8f9fa;
}

.data-table th:last-child[b-re0z34hmn5] {
    border-right: none;
}

.data-table td[b-re0z34hmn5] {
    padding: 12px;
    border-bottom: 1px solid #d1d5db;
    border-right: 1px solid #e9ecef;
    vertical-align: middle;
}

.data-table td:last-child[b-re0z34hmn5] {
    border-right: none;
}

.data-table tr:hover[b-re0z34hmn5] {
    background: #f8f9fa;
}

.text-center[b-re0z34hmn5] {
    text-align: center;
}

.hide-mobile[b-re0z34hmn5] {
    display: table-cell;
}

.hide-xs[b-re0z34hmn5] {
    display: table-cell;
}

/* Badges */
.badge[b-re0z34hmn5] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.badge-info[b-re0z34hmn5] {
    background: #d1ecf1;
    color: #0c5460;
}

.badge-primary[b-re0z34hmn5] {
    background: #cce5ff;
    color: #004085;
}

.badge-warning[b-re0z34hmn5] {
    background: #fff3cd;
    color: #856404;
}

.badge-success[b-re0z34hmn5] {
    background: #d4edda;
    color: #155724;
}

.badge-danger[b-re0z34hmn5] {
    background: #f8d7da;
    color: #721c24;
}

.badge-secondary[b-re0z34hmn5] {
    background: #e2e3e5;
    color: #383d41;
}

/* Action Buttons */
.action-btn[b-re0z34hmn5] {
    background: transparent;
    border: none;
    padding: 8px;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
}

.action-btn:hover:not(:disabled)[b-re0z34hmn5] {
    background: #f8f9fa;
    transform: scale(1.05);
}

.action-btn:active:not(:disabled)[b-re0z34hmn5] {
    transform: scale(0.95);
}

.action-btn:disabled[b-re0z34hmn5] {
    opacity: 0.4;
    cursor: not-allowed !important;
    transform: none;
}

.view-btn[b-re0z34hmn5] {
    color: #007bff;
}

.view-btn:hover:not(:disabled)[b-re0z34hmn5] {
    background: #e7f3ff;
    color: #0056b3;
}

/* Empty State */
.empty-state[b-re0z34hmn5] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.empty-state-icon[b-re0z34hmn5] {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

.empty-state-title[b-re0z34hmn5] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #495057;
}

.empty-state-message[b-re0z34hmn5] {
    font-size: 14px;
    margin: 0;
    color: #6c757d;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-container[b-re0z34hmn5] {
        padding: 16px;
    }

    .position-header-content[b-re0z34hmn5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .position-actions[b-re0z34hmn5] {
        width: 100%;
        justify-content: flex-start;
    }

    .candidates-card-header[b-re0z34hmn5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        padding: 16px 20px;
    }

    .candidates-card-content[b-re0z34hmn5] {
        padding: 16px 20px;
    }

    .hide-mobile[b-re0z34hmn5] {
        display: none;
    }
}

@media (max-width: 480px) {
    .breadcrumbs[b-re0z34hmn5] {
        margin-bottom: 16px;
    }

    .position-header[b-re0z34hmn5] {
        padding: 16px;
        margin-bottom: 16px;
    }

    .position-info h1[b-re0z34hmn5] {
        font-size: 1.5rem;
    }

    .hide-xs[b-re0z34hmn5] {
        display: none;
    }

    .data-table th[b-re0z34hmn5],
    .data-table td[b-re0z34hmn5] {
        padding: 8px;
    }

    .btn[b-re0z34hmn5] {
        padding: 8px 12px;
        font-size: 13px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Dashboard/EmployeeDashboard.razor.rz.scp.css */
/* EmployeeDashboard.razor.css - Blazor CSS Isolation */

/* Loading State */
.loading-container[b-c3w8pwpjgq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}

.loading-spinner[b-c3w8pwpjgq] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-c3w8pwpjgq 1s linear infinite;
    margin-bottom: 20px;
}

.loading-text[b-c3w8pwpjgq] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

@keyframes spin-b-c3w8pwpjgq {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.no-activity[b-c3w8pwpjgq] {
    text-align: center;
    color: #6c757d;
    font-style: italic;
    margin: 20px 0;
}

/* Page Container */
.page-container[b-c3w8pwpjgq] {
    padding: 16px;
    max-width: none;
    width: 100%;
    margin: 0;
    box-sizing: border-box;
    overflow-x: hidden;
}

/* Page Header */
.page-header[b-c3w8pwpjgq] {
    margin-bottom: 32px;
}

.page-title[b-c3w8pwpjgq] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

/* Access Denied State */
.access-denied[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
}

.access-denied-card[b-c3w8pwpjgq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    padding: 48px;
    text-align: center;
    max-width: 400px;
    width: 100%;
}

.access-denied-icon[b-c3w8pwpjgq] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 24px;
}

.access-denied-title[b-c3w8pwpjgq] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

.access-denied-message[b-c3w8pwpjgq] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0 0 32px 0;
    line-height: 1.5;
}

/* Role Alert */
.role-alert[b-c3w8pwpjgq] {
    padding: 16px 20px;
    border-radius: 8px;
    margin-bottom: 32px;
    border-left: 4px solid;
    display: flex;
    align-items: center;
    gap: 12px;
}

.role-alert.info[b-c3w8pwpjgq] {
    background: #d1ecf1;
    border-color: #17a2b8;
    color: #0c5460;
}

.role-alert.success[b-c3w8pwpjgq] {
    background: #d4edda;
    border-color: #28a745;
    color: #155724;
}

.role-alert.normal[b-c3w8pwpjgq] {
    background: #e2e3e5;
    border-color: #6c757d;
    color: #383d41;
}

.role-alert-icon[b-c3w8pwpjgq] {
    font-size: 1.5rem;
}

.role-alert-text[b-c3w8pwpjgq] {
    font-size: 1rem;
    font-weight: 500;
    margin: 0;
}

/* Stats Container - Single unified container for all stats */
.stats-container[b-c3w8pwpjgq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 32px;
    margin-left: auto;
    margin-right: auto;
    max-width: 1000px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.stat-item[b-c3w8pwpjgq] {
    padding: 0;
    transition: transform 0.2s ease;
    cursor: pointer;
    border-radius: 8px;
    padding: 8px;
    margin: -8px;
}

.stat-item:hover[b-c3w8pwpjgq] {
    transform: translateY(-2px);
    background: #f8f9fa;
}

.stat-item:focus[b-c3w8pwpjgq] {
    outline: 2px solid #007bff;
    outline-offset: 2px;
}

.stat-item .stat-card-content[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.stat-item .stat-card-icon[b-c3w8pwpjgq] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 600;
    flex-shrink: 0;
}

.stat-item .stat-card-icon.primary[b-c3w8pwpjgq] {
    background: #e3f2fd;
    color: #1976d2;
}

.stat-item .stat-card-icon.success[b-c3w8pwpjgq] {
    background: #e8f5e8;
    color: #2e7d32;
}

.stat-item .stat-card-icon.warning[b-c3w8pwpjgq] {
    background: #fff3e0;
    color: #f57c00;
}

.stat-item .stat-card-icon.info[b-c3w8pwpjgq] {
    background: #e1f5fe;
    color: #0288d1;
}

.stat-item .stat-card-info[b-c3w8pwpjgq] {
    flex: 1;
    min-width: 0;
}

.stat-item .stat-card-label[b-c3w8pwpjgq] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin: 0 0 4px 0;
    font-weight: 500;
}

.stat-item .stat-card-value[b-c3w8pwpjgq] {
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
}

/* Add dividers between stats */
.stat-item:not(:last-child)[b-c3w8pwpjgq] {
    position: relative;
}

.stat-item:not(:last-child)[b-c3w8pwpjgq]::after {
    content: '';
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 60%;
    background: #e9ecef;
}

.stat-item[b-c3w8pwpjgq] {
    position: relative;
}

@media (max-width: 900px) {
    .stats-container[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .stat-item:not(:last-child)[b-c3w8pwpjgq]::after {
        display: none;
    }

    .stat-item:not(:last-child)[b-c3w8pwpjgq] {
        border-bottom: 1px solid #e9ecef;
        padding-bottom: 16px;
        margin-bottom: 0;
    }

    .stat-item:last-child[b-c3w8pwpjgq] {
        padding-bottom: 0;
    }
}

@media (max-width: 600px) {
    .stats-container[b-c3w8pwpjgq] {
        padding: 16px;
        gap: 12px;
    }

    .stat-item .stat-card-icon[b-c3w8pwpjgq] {
        width: 44px;
        height: 44px;
        font-size: 1.125rem;
    }

    .stat-item .stat-card-value[b-c3w8pwpjgq] {
        font-size: 1.5rem;
    }
}

.stat-card-value.primary[b-c3w8pwpjgq] {
    color: #1976d2;
}

.stat-card-value.success[b-c3w8pwpjgq] {
    color: #2e7d32;
}

.stat-card-value.warning[b-c3w8pwpjgq] {
    color: #f57c00;
}

.stat-card-value.info[b-c3w8pwpjgq] {
    color: #0288d1;
}

/* Management Cards */
.management-card[b-c3w8pwpjgq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    grid-column: span 2;
}

.management-card-header[b-c3w8pwpjgq] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.management-card-title[b-c3w8pwpjgq] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.management-card-content[b-c3w8pwpjgq] {
    padding: 24px;
}

/* Action Buttons Grid */
.actions-grid[b-c3w8pwpjgq] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
}

.actions-grid.two-columns[b-c3w8pwpjgq] {
    grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
}

.actions-grid.four-columns[b-c3w8pwpjgq] {
    grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
}

/* Buttons */
.btn[b-c3w8pwpjgq] {
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 48px;
    width: 100%;
    margin-bottom: 12px;
}

.btn-filled[b-c3w8pwpjgq] {
    color: white;
}

.btn-outline[b-c3w8pwpjgq] {
    background: transparent;
    border: 2px solid;
}

.btn-primary.btn-filled[b-c3w8pwpjgq] {
    background: #007bff;
}

.btn-primary.btn-filled:hover[b-c3w8pwpjgq] {
    background: #0056b3;
}

.btn-primary.btn-outline[b-c3w8pwpjgq] {
    color: #007bff;
    border-color: #007bff;
}

.btn-primary.btn-outline:hover[b-c3w8pwpjgq] {
    background: #007bff;
    color: white;
}

.btn-secondary.btn-filled[b-c3w8pwpjgq] {
    background: #6c757d;
}

.btn-secondary.btn-filled:hover[b-c3w8pwpjgq] {
    background: #545b62;
}

.btn-secondary.btn-outline[b-c3w8pwpjgq] {
    color: #6c757d;
    border-color: #6c757d;
}

.btn-secondary.btn-outline:hover[b-c3w8pwpjgq] {
    background: #6c757d;
    color: white;
}

.btn-success.btn-filled[b-c3w8pwpjgq] {
    background: #28a745;
}

.btn-success.btn-filled:hover[b-c3w8pwpjgq] {
    background: #1e7e34;
}

.btn-success.btn-outline[b-c3w8pwpjgq] {
    color: #28a745;
    border-color: #28a745;
}

.btn-success.btn-outline:hover[b-c3w8pwpjgq] {
    background: #28a745;
    color: white;
}

.btn-warning.btn-filled[b-c3w8pwpjgq] {
    background: #ffc107;
    color: #212529;
}

.btn-warning.btn-filled:hover[b-c3w8pwpjgq] {
    background: #e0a800;
}

.btn-warning.btn-outline[b-c3w8pwpjgq] {
    color: #ffc107;
    border-color: #ffc107;
}

.btn-warning.btn-outline:hover[b-c3w8pwpjgq] {
    background: #ffc107;
    color: #212529;
}

.btn-info.btn-filled[b-c3w8pwpjgq] {
    background: #17a2b8;
}

.btn-info.btn-filled:hover[b-c3w8pwpjgq] {
    background: #138496;
}

.btn-info.btn-outline[b-c3w8pwpjgq] {
    color: #17a2b8;
    border-color: #17a2b8;
}

.btn-info.btn-outline:hover[b-c3w8pwpjgq] {
    background: #17a2b8;
    color: white;
}

.btn-icon[b-c3w8pwpjgq] {
    font-size: 1.125rem;
}

/* Activity Card */
.activity-card[b-c3w8pwpjgq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.activity-card-header[b-c3w8pwpjgq] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.activity-card-title[b-c3w8pwpjgq] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.activity-card-content[b-c3w8pwpjgq] {
    padding: 24px;
}

/* Activity List */
.activity-list[b-c3w8pwpjgq] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.activity-item[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid #f8f9fa;
}

.activity-item:last-child[b-c3w8pwpjgq] {
    border-bottom: none;
}

.activity-icon[b-c3w8pwpjgq] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    color: #6c757d;
    flex-shrink: 0;
}

.activity-text[b-c3w8pwpjgq] {
    font-size: 0.875rem;
    color: #495057;
    margin: 0;
}

/* Department Info Card */
.department-card[b-c3w8pwpjgq] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.department-card-header[b-c3w8pwpjgq] {
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.department-card-title[b-c3w8pwpjgq] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.department-card-content[b-c3w8pwpjgq] {
    padding: 24px;
}

.department-info[b-c3w8pwpjgq] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.department-info-item[b-c3w8pwpjgq] {
    display: flex;
    gap: 8px;
}

.department-info-label[b-c3w8pwpjgq] {
    font-weight: 600;
    color: #495057;
    min-width: 100px;
}

.department-info-value[b-c3w8pwpjgq] {
    color: #212529;
}

/* Common Sections Grid */
.common-sections[b-c3w8pwpjgq] {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(min(400px, 100%), 1fr));
    margin-top: 32px;
}

/* Responsive Design */
@media (max-width: 1199px) {
    .management-card[b-c3w8pwpjgq] {
        grid-column: span 1;
    }

    .actions-grid.two-columns[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
    }

    .actions-grid.four-columns[b-c3w8pwpjgq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .dashboard-grid.three-columns[b-c3w8pwpjgq] {
        grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
    }
}

@media (max-width: 900px) {
    .dashboard-grid.three-columns[b-c3w8pwpjgq] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .page-container[b-c3w8pwpjgq] {
        padding: 16px;
    }

    .page-title[b-c3w8pwpjgq] {
        font-size: 1.5rem;
    }

    .dashboard-grid[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dashboard-grid.four-columns[b-c3w8pwpjgq],
    .dashboard-grid.three-columns[b-c3w8pwpjgq],
    .dashboard-grid.two-columns[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
    }

    .stat-card[b-c3w8pwpjgq] {
        padding: 16px;
    }

    .stat-card-content[b-c3w8pwpjgq] {
        gap: 12px;
    }

    .stat-card-icon[b-c3w8pwpjgq] {
        width: 44px;
        height: 44px;
        font-size: 1.125rem;
    }

    .stat-card-value[b-c3w8pwpjgq] {
        font-size: 1.5rem;
    }

    .management-card-content[b-c3w8pwpjgq] {
        padding: 20px;
    }

    .actions-grid[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .actions-grid.two-columns[b-c3w8pwpjgq],
    .actions-grid.four-columns[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
    }

    .btn[b-c3w8pwpjgq] {
        padding: 14px 16px;
        font-size: 16px;
        min-height: 52px;
    }

    .common-sections[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
        gap: 16px;
        margin-top: 24px;
    }

    .access-denied-card[b-c3w8pwpjgq] {
        padding: 32px 24px;
    }

    .access-denied-icon[b-c3w8pwpjgq] {
        font-size: 3rem;
        margin-bottom: 20px;
    }

    .access-denied-title[b-c3w8pwpjgq] {
        font-size: 1.25rem;
    }
}

@media (max-width: 479px) {
    .page-container[b-c3w8pwpjgq] {
        padding: 12px;
    }

    .stat-card[b-c3w8pwpjgq] {
        padding: 16px;
    }

    .stat-card-content[b-c3w8pwpjgq] {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }

    .management-card-content[b-c3w8pwpjgq],
    .activity-card-content[b-c3w8pwpjgq],
    .department-card-content[b-c3w8pwpjgq] {
        padding: 16px;
    }

    .access-denied-card[b-c3w8pwpjgq] {
        padding: 24px 16px;
    }
}

/* Activity Section */
.activity-section[b-c3w8pwpjgq] {
    margin-top: 3rem;
}

.section-title[b-c3w8pwpjgq] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 1.5rem;
    letter-spacing: -0.02em;
    position: relative;
    padding-bottom: 0.75rem;
}

.section-title[b-c3w8pwpjgq]::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60px;
    height: 4px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 2px;
}

.page-subtitle[b-c3w8pwpjgq] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

.activity-grid[b-c3w8pwpjgq] {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(auto-fit, minmax(min(400px, 100%), 1fr));
}

.activity-grid-two-columns[b-c3w8pwpjgq] {
    grid-template-columns: repeat(2, 1fr);
    margin-top: 1.5rem;
}

.activity-card-full-width[b-c3w8pwpjgq] {
    width: 100%;
    margin-bottom: 1.5rem;
}

/* Activity Table Card */
.activity-table-card[b-c3w8pwpjgq] {
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.activity-table-header[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 0.875rem;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #fafbfc 0%, #ffffff 100%);
}

.activity-table-icon[b-c3w8pwpjgq] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.activity-table-icon.new-interviews[b-c3w8pwpjgq] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.activity-table-icon.pending-approval[b-c3w8pwpjgq] {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(240, 147, 251, 0.4);
}

.activity-table-icon.client-responses[b-c3w8pwpjgq] {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(79, 172, 254, 0.4);
}

.activity-table-title[b-c3w8pwpjgq] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
    letter-spacing: -0.01em;
}

.activity-table-subtitle[b-c3w8pwpjgq] {
    font-size: 0.6875rem;
    color: #6b7280;
    margin: 0.125rem 0 0 0;
}

.activity-table-subtitle .activity-link[b-c3w8pwpjgq] {
    color: #3b82f6;
    text-decoration: none;
    cursor: pointer;
    font-weight: 500;
    transition: color 0.2s ease;
}

.activity-table-subtitle .activity-link:hover[b-c3w8pwpjgq] {
    color: #2563eb;
    text-decoration: underline;
}

.activity-table-body[b-c3w8pwpjgq] {
    padding: 0;
    max-height: 380px;
    overflow-y: auto;
    position: relative;
}

.activity-card-full-width .activity-table-body[b-c3w8pwpjgq] {
    max-height: 400px;
    padding: 0.5rem;
}

.activity-card-full-width .table-container[b-c3w8pwpjgq] {
    overflow-x: auto;
    overflow-y: visible;
}

.activity-card-full-width .data-table[b-c3w8pwpjgq] {
    width: 100%;
    min-width: 600px;
}

/* Scrollbar Styling */
.activity-table-body[b-c3w8pwpjgq]::-webkit-scrollbar {
    width: 6px;
}

.activity-table-body[b-c3w8pwpjgq]::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.activity-table-body[b-c3w8pwpjgq]::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}

.activity-table-body[b-c3w8pwpjgq]::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Activity List (Simple, clean list design) */
.activity-list[b-c3w8pwpjgq] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.activity-item[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 0.875rem;
    border-bottom: 1px solid #f3f4f6;
    cursor: pointer;
    min-height: 60px;
    position: relative;
}

.activity-item:last-child[b-c3w8pwpjgq] {
    border-bottom: 1px solid #e5e7eb;
}

.activity-item-content[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.activity-item-text[b-c3w8pwpjgq] {
    font-size: 0.875rem;
    color: #374151;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

.activity-item-text strong[b-c3w8pwpjgq] {
    color: #111827;
    font-weight: 600;
}

.activity-item-time[b-c3w8pwpjgq] {
    font-size: 0.75rem;
    color: #6b7280;
    white-space: nowrap;
    flex-shrink: 0;
    font-weight: 500;
    background: #f3f4f6;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
}

.activity-item-action[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    color: #6b7280;
    flex-shrink: 0;
    margin-left: 0.5rem;
}

/* Response Item Specific Styles */
.response-item[b-c3w8pwpjgq] {
    min-height: auto;
    padding: 0.875rem 0.875rem;
}

.response-item-main[b-c3w8pwpjgq] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.response-item-header[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.response-item-header .activity-item-text[b-c3w8pwpjgq] {
    flex: 1;
    min-width: 200px;
    font-size: 0.9375rem;
    line-height: 1.4;
    -webkit-line-clamp: 1;
    line-clamp: 1;
}

.response-item-header .response-badge[b-c3w8pwpjgq] {
    flex-shrink: 0;
    margin-left: auto;
}

.response-item-details[b-c3w8pwpjgq] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.response-detail-item[b-c3w8pwpjgq] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    color: #6b7280;
    white-space: nowrap;
}

.response-detail-item svg[b-c3w8pwpjgq] {
    flex-shrink: 0;
    color: #9ca3af;
}

/* Approval Item Specific Styles */
.approval-item[b-c3w8pwpjgq] {
    min-height: auto;
    padding: 0.875rem 0.875rem;
}

.approval-badge[b-c3w8pwpjgq] {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.875rem;
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 600;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    color: #92400e;
    border: 1px solid #fcd34d;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    flex-shrink: 0;
}

/* Data Table */
.table-container[b-c3w8pwpjgq] {
    overflow-x: auto;
}

.data-table[b-c3w8pwpjgq] {
    width: 100%;
    border-collapse: collapse;
}

.data-table thead[b-c3w8pwpjgq] {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.data-table th[b-c3w8pwpjgq] {
    padding: 0.5rem 0.75rem;
    text-align: left;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.data-table tbody tr[b-c3w8pwpjgq] {
    border-bottom: 1px solid #f3f4f6;
}

.data-table tbody tr:last-child[b-c3w8pwpjgq] {
    border-bottom: none;
}

.data-table td[b-c3w8pwpjgq] {
    padding: 0.625rem 0.75rem;
    font-size: 0.8125rem;
    color: #374151;
}

.candidate-info[b-c3w8pwpjgq] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.candidate-name[b-c3w8pwpjgq] {
    font-weight: 600;
    color: #111827;
    font-size: 0.875rem;
}

.candidate-email[b-c3w8pwpjgq] {
    font-size: 0.75rem;
    color: #6b7280;
}

.position-title[b-c3w8pwpjgq] {
    font-weight: 500;
    color: #111827;
    font-size: 0.8125rem;
}

.client-name[b-c3w8pwpjgq] {
    color: #374151;
    font-size: 0.8125rem;
}

.days-ago[b-c3w8pwpjgq] {
    color: #6b7280;
    font-size: 0.8125rem;
}

.response-badge[b-c3w8pwpjgq] {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.875rem;
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: capitalize;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.response-badge.accepted[b-c3w8pwpjgq] {
    background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
    color: #065f46;
    border: 1px solid #6ee7b7;
}

.response-badge.rejected[b-c3w8pwpjgq] {
    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.btn-table-action[b-c3w8pwpjgq] {
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 600;
    border: 1px solid #e5e7eb;
    background: white;
    color: #374151;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
}

.btn-table-action:hover[b-c3w8pwpjgq] {
    background: #007bff;
    border-color: #007bff;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.3);
}

/* Empty State */
.empty-state[b-c3w8pwpjgq] {
    padding: 3rem 1rem;
    text-align: center;
    color: #9ca3af;
    animation: fadeIn-b-c3w8pwpjgq 0.5s ease-in;
}

@keyframes fadeIn-b-c3w8pwpjgq {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.empty-state svg[b-c3w8pwpjgq] {
    margin: 0 auto 1rem;
    opacity: 0.4;
    width: 48px;
    height: 48px;
}

.empty-state p[b-c3w8pwpjgq] {
    margin: 0;
    font-size: 0.8125rem;
    color: #6b7280;
}

/* Responsive for Activity Tables */
/* Stagger animation for activity cards */
.activity-table-card:nth-child(1)[b-c3w8pwpjgq] {
    animation: slideUp-b-c3w8pwpjgq 0.4s ease-out;
}

.activity-table-card:nth-child(2)[b-c3w8pwpjgq] {
    animation: slideUp-b-c3w8pwpjgq 0.5s ease-out;
}

.activity-table-card:nth-child(3)[b-c3w8pwpjgq] {
    animation: slideUp-b-c3w8pwpjgq 0.6s ease-out;
}

@keyframes slideUp-b-c3w8pwpjgq {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 1200px) {
    .activity-grid[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
    }

    .activity-grid-two-columns[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .data-table th[b-c3w8pwpjgq],
    .data-table td[b-c3w8pwpjgq] {
        padding: 0.5rem 0.75rem;
        font-size: 0.75rem;
    }

    .activity-table-header[b-c3w8pwpjgq] {
        padding: 0.875rem 0.75rem;
    }

    .section-title[b-c3w8pwpjgq] {
        font-size: 1.25rem;
    }

    .activity-grid[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
    }

    .activity-grid-two-columns[b-c3w8pwpjgq] {
        grid-template-columns: 1fr;
        margin-top: 1rem;
    }

    .activity-card-full-width[b-c3w8pwpjgq] {
        margin-bottom: 1rem;
    }

    .response-item[b-c3w8pwpjgq],
    .approval-item[b-c3w8pwpjgq] {
        padding: 0.75rem 0.75rem;
    }

    .response-item-header[b-c3w8pwpjgq] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .response-item-header .activity-item-text[b-c3w8pwpjgq] {
        min-width: 0;
        width: 100%;
    }

    .response-item-header .response-badge[b-c3w8pwpjgq],
    .response-item-header .approval-badge[b-c3w8pwpjgq] {
        margin-left: 0;
        align-self: flex-start;
    }

    .response-item-details[b-c3w8pwpjgq] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.625rem;
    }

    .response-detail-item[b-c3w8pwpjgq] {
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Legacy/DepartmentImport.razor.rz.scp.css */
/* DepartmentImport.razor.css - Scoped Styles */

/* Page Container */
.page-container[b-r78zbcjzn5] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Breadcrumbs */
.breadcrumbs[b-r78zbcjzn5] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    padding: 8px 0;
}

.breadcrumb-item[b-r78zbcjzn5] {
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
}

.breadcrumb-item:hover:not(.disabled)[b-r78zbcjzn5] {
    color: #007bff;
}

.breadcrumb-item.disabled[b-r78zbcjzn5] {
    color: #212529;
    font-weight: 500;
}

.breadcrumb-separator[b-r78zbcjzn5] {
    color: #adb5bd;
}

/* Page Header */
.page-title[b-r78zbcjzn5] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.page-subtitle[b-r78zbcjzn5] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0 0 32px 0;
}

/* Section Styles */
.import-section[b-r78zbcjzn5] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.section-header[b-r78zbcjzn5] {
    margin-bottom: 24px;
}

.section-header h2[b-r78zbcjzn5] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

/* Form Styles */
.add-department-form[b-r78zbcjzn5] {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
}

.add-department-form .form-input[b-r78zbcjzn5] {
    flex: 1;
    min-width: 0;
}

.form-input[b-r78zbcjzn5] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.9375rem;
    transition: all 0.2s;
    background: white;
}

.form-input:focus[b-r78zbcjzn5] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-input:disabled[b-r78zbcjzn5] {
    background: #e9ecef;
    cursor: not-allowed;
    opacity: 0.6;
}

.form-input[b-r78zbcjzn5]::placeholder {
    color: #adb5bd;
}

/* Buttons */
.btn[b-r78zbcjzn5] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.btn-primary[b-r78zbcjzn5] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-r78zbcjzn5] {
    background: #0056b3;
}

.btn-primary:disabled[b-r78zbcjzn5] {
    background: #6c757d;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Added Departments Section */
.added-departments[b-r78zbcjzn5] {
    border-top: 1px solid #e9ecef;
    padding-top: 24px;
    margin-top: 24px;
}

.added-departments h3[b-r78zbcjzn5] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

.department-list[b-r78zbcjzn5] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.department-item[b-r78zbcjzn5] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 6px;
    animation: slideIn-b-r78zbcjzn5 0.3s ease-out;
}

@keyframes slideIn-b-r78zbcjzn5 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.check-icon[b-r78zbcjzn5] {
    font-size: 1.125rem;
    color: #155724;
    font-weight: bold;
    flex-shrink: 0;
}

.department-item .dept-name[b-r78zbcjzn5] {
    flex: 1;
    font-weight: 500;
    color: #155724;
    font-size: 0.9375rem;
}

/* Import Layout - Two Column */
.import-layout[b-r78zbcjzn5] {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 24px;
    margin-top: 32px;
}

/* Existing Departments Section */
.existing-departments-section[b-r78zbcjzn5] {
    background: white;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    height: fit-content;
    max-height: 650px;
    display: flex;
    flex-direction: column;
}

.existing-departments-section .section-header[b-r78zbcjzn5] {
    margin-bottom: 16px;
}

.existing-departments-section .section-header h2[b-r78zbcjzn5] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

/* Search Container */
.search-container[b-r78zbcjzn5] {
    margin-bottom: 12px;
}

.search-input[b-r78zbcjzn5] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.875rem;
    transition: all 0.2s;
    background: white;
    box-sizing: border-box;
}

.search-input:focus[b-r78zbcjzn5] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.search-input[b-r78zbcjzn5]::placeholder {
    color: #adb5bd;
}

.existing-department-list[b-r78zbcjzn5] {
    flex: 1;
    overflow-y: auto;
    margin-bottom: 16px;
    max-height: 360px; /* Approximately 8 items visible */
    min-height: 200px;
}

/* Custom scrollbar */
.existing-department-list[b-r78zbcjzn5]::-webkit-scrollbar {
    width: 6px;
}

.existing-department-list[b-r78zbcjzn5]::-webkit-scrollbar-track {
    background: #f8f9fa;
    border-radius: 3px;
}

.existing-department-list[b-r78zbcjzn5]::-webkit-scrollbar-thumb {
    background: #dee2e6;
    border-radius: 3px;
}

.existing-department-list[b-r78zbcjzn5]::-webkit-scrollbar-thumb:hover {
    background: #adb5bd;
}

.existing-department-item[b-r78zbcjzn5] {
    padding: 12px;
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s;
}

.existing-department-item:last-child[b-r78zbcjzn5] {
    border-bottom: none;
}

.existing-department-item:hover[b-r78zbcjzn5] {
    background-color: #f8f9fa;
}

.existing-department-item .dept-name[b-r78zbcjzn5] {
    font-weight: 500;
    color: #212529;
    font-size: 0.9375rem;
}

.department-count[b-r78zbcjzn5] {
    padding-top: 12px;
    border-top: 1px solid #e9ecef;
    font-size: 0.8125rem;
    color: #6c757d;
    text-align: center;
    font-weight: 500;
}

/* Loading and Empty States */
.loading-state[b-r78zbcjzn5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
    color: #6c757d;
}

.loading-state p[b-r78zbcjzn5] {
    margin-top: 16px;
    font-size: 0.875rem;
}

.spinner[b-r78zbcjzn5] {
    border: 3px solid #f3f3f3;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    animation: spin-b-r78zbcjzn5 1s linear infinite;
}

@keyframes spin-b-r78zbcjzn5 {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.empty-state[b-r78zbcjzn5] {
    text-align: center;
    padding: 48px 16px;
    color: #6c757d;
}

.empty-state p[b-r78zbcjzn5] {
    margin: 0;
    font-size: 0.875rem;
    font-style: italic;
}

.empty-state-inline[b-r78zbcjzn5] {
    text-align: center;
    padding: 24px 16px;
    color: #6c757d;
}

.empty-state-inline p[b-r78zbcjzn5] {
    margin: 0;
    font-size: 0.875rem;
    font-style: italic;
}

/* Validation Message */
.validation-message[b-r78zbcjzn5] {
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 16px;
    font-size: 0.875rem;
    animation: slideDown-b-r78zbcjzn5 0.3s ease-out;
    font-weight: 500;
}

@keyframes slideDown-b-r78zbcjzn5 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.validation-message.error[b-r78zbcjzn5] {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

.validation-message.success[b-r78zbcjzn5] {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.validation-message.warning[b-r78zbcjzn5] {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffeeba;
}

/* Responsive Design */
@media (max-width: 767px) {
    .page-container[b-r78zbcjzn5] {
        padding: 16px;
    }

    .page-title[b-r78zbcjzn5] {
        font-size: 1.5rem;
    }

    .import-layout[b-r78zbcjzn5] {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .existing-departments-section[b-r78zbcjzn5] {
        max-height: 400px;
    }

    .add-department-form[b-r78zbcjzn5] {
        flex-direction: column;
    }

    .btn[b-r78zbcjzn5] {
        width: 100%;
    }
}

@media (max-width: 479px) {
    .page-container[b-r78zbcjzn5] {
        padding: 12px;
    }

    .breadcrumbs[b-r78zbcjzn5] {
        font-size: 12px;
    }

    .page-title[b-r78zbcjzn5] {
        font-size: 1.25rem;
    }

    .import-section[b-r78zbcjzn5],
    .existing-departments-section[b-r78zbcjzn5] {
        padding: 16px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Legacy/LegacyCandidateImport.razor.rz.scp.css */
/* LegacyCandidateImport.razor.css - Scoped Styles */

/* Imported Candidates Section */
.imported-candidates-section[b-wmqb6trh8k] {
    margin-top: 32px;
}

.section-header[b-wmqb6trh8k] {
    margin-bottom: 24px;
}

.section-header h2[b-wmqb6trh8k] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.section-header p[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.candidates-grid[b-wmqb6trh8k] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.candidate-item-card[b-wmqb6trh8k] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: box-shadow 0.2s;
}

.candidate-item-card:hover[b-wmqb6trh8k] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.candidate-info h3[b-wmqb6trh8k] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.candidate-info .candidate-email[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0 0 4px 0;
}

.candidate-info .candidate-position[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #495057;
    font-weight: 500;
    margin: 0;
}

.section-actions[b-wmqb6trh8k] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 16px;
    border-top: 1px solid #e9ecef;
}

/* Page Container */
.page-container[b-wmqb6trh8k] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Breadcrumbs */
.breadcrumbs[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    padding: 8px 0;
}

.breadcrumb-link[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
}

.breadcrumb-link:hover[b-wmqb6trh8k] {
    color: #007bff;
}

.breadcrumb-current[b-wmqb6trh8k] {
    color: #212529;
    font-weight: 500;
    font-size: 14px;
}

.breadcrumb-separator[b-wmqb6trh8k] {
    color: #adb5bd;
    flex-shrink: 0;
}

/* Page Header */
.page-header[b-wmqb6trh8k] {
    margin-bottom: 32px;
}

.page-header-content[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.page-title[b-wmqb6trh8k] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.page-subtitle[b-wmqb6trh8k] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

/* Content Grid */
.content-grid[b-wmqb6trh8k] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 24px;
    margin-bottom: 32px;
}

/* Card Styles */
.card[b-wmqb6trh8k] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.card-header[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px;
    border-bottom: 1px solid #e9ecef;
}

.card-icon[b-wmqb6trh8k] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.card-icon.csv-icon[b-wmqb6trh8k] {
    background: #e3f2fd;
    color: #1976d2;
}

.card-icon.manual-icon[b-wmqb6trh8k] {
    background: #fff3e0;
    color: #f57c00;
}

.card-icon.preview-icon[b-wmqb6trh8k] {
    background: #e8f5e9;
    color: #2e7d32;
}

.card-header-text[b-wmqb6trh8k] {
    flex: 1;
    min-width: 0;
}

.card-title[b-wmqb6trh8k] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.card-description[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.card-content[b-wmqb6trh8k] {
    padding: 24px;
}

/* File Upload Zone */
.file-upload-zone[b-wmqb6trh8k] {
    position: relative;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 48px 24px;
    text-align: center;
    background: #f8f9fa;
    transition: all 0.2s;
    cursor: pointer;
    margin-bottom: 20px;
    overflow: hidden;
}

.file-upload-zone:hover[b-wmqb6trh8k] {
    border-color: #007bff;
    background: #e7f3ff;
}

.file-upload-zone.has-file[b-wmqb6trh8k] {
    border-color: #28a745;
    background: #f0f9f3;
}

.file-input[b-wmqb6trh8k] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
    font-size: 0; /* Hide any text */
    color: transparent; /* Make text transparent */
}

/* Hide the default file input button completely */
.file-input[b-wmqb6trh8k]::file-selector-button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-wmqb6trh8k]::-webkit-file-upload-button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-wmqb6trh8k]::-ms-browse {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-wmqb6trh8k]::before {
    display: none !important;
}

.file-input[b-wmqb6trh8k]::after {
    display: none !important;
}

.file-upload-label[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    pointer-events: none;
    position: relative;
    z-index: 1;
}

.upload-icon[b-wmqb6trh8k],
.file-check-icon[b-wmqb6trh8k] {
    color: #6c757d;
    flex-shrink: 0;
}

.file-check-icon[b-wmqb6trh8k] {
    color: #28a745;
}

.upload-text[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}

.upload-title[b-wmqb6trh8k] {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.upload-subtitle[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #6c757d;
}

.file-name-display[b-wmqb6trh8k] {
    font-size: 1rem;
    font-weight: 600;
    color: #155724;
    word-break: break-all;
    text-align: center;
}

.file-size-display[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* File Actions */
.file-actions[b-wmqb6trh8k] {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

/* Info Box */
.info-box[b-wmqb6trh8k] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    background: #e7f3ff;
    border: 1px solid #b3d9ff;
    border-radius: 8px;
    font-size: 0.875rem;
}

.info-icon[b-wmqb6trh8k] {
    color: #0288d1;
    flex-shrink: 0;
    margin-top: 2px;
}

.info-content[b-wmqb6trh8k] {
    flex: 1;
    color: #495057;
}

.info-content strong[b-wmqb6trh8k] {
    color: #212529;
}

/* Form Styles */
.form-modern[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.form-group[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0; /* Prevents overflow */
}

.form-row[b-wmqb6trh8k] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    width: 100%;
}

.form-label-modern[b-wmqb6trh8k] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
    display: flex;
    align-items: center;
    gap: 4px;
}

.required-mark[b-wmqb6trh8k] {
    color: #dc3545;
}

.form-input-modern[b-wmqb6trh8k],
.form-select-modern[b-wmqb6trh8k] {
    width: 100%;
    max-width: 100%;
    padding: 10px 14px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.9375rem;
    transition: all 0.2s;
    background: white;
    box-sizing: border-box;
}

.form-input-modern:focus[b-wmqb6trh8k],
.form-select-modern:focus[b-wmqb6trh8k] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-input-modern[b-wmqb6trh8k]::placeholder {
    color: #adb5bd;
}

.input-with-icon[b-wmqb6trh8k] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 100%;
}

.input-icon[b-wmqb6trh8k] {
    position: absolute;
    left: 12px;
    color: #6c757d;
    pointer-events: none;
    flex-shrink: 0;
}

.form-input-modern.has-icon[b-wmqb6trh8k] {
    padding-left: 40px;
}

.form-hint-text[b-wmqb6trh8k] {
    font-size: 0.8125rem;
    color: #dc3545;
    margin-top: 4px;
    display: block;
    font-style: italic;
}

/* Position Filter Toggle */
.position-filter-toggle[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    padding: 8px 12px;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #e9ecef;
}

.toggle-switch[b-wmqb6trh8k] {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 24px;
    margin: 0;
    cursor: pointer;
}

.toggle-switch input[b-wmqb6trh8k] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-wmqb6trh8k] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.3s;
    border-radius: 24px;
}

.toggle-slider[b-wmqb6trh8k]:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
}

.toggle-switch input:checked + .toggle-slider[b-wmqb6trh8k] {
    background-color: #007bff;
}

.toggle-switch input:checked + .toggle-slider[b-wmqb6trh8k]:before {
    transform: translateX(24px);
}

.toggle-label[b-wmqb6trh8k] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
    user-select: none;
}

/* Buttons */
.btn[b-wmqb6trh8k] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.btn-primary[b-wmqb6trh8k] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-wmqb6trh8k] {
    background: #0056b3;
}

.btn-primary:disabled[b-wmqb6trh8k] {
    background: #6c757d;
    cursor: not-allowed;
    opacity: 0.6;
}

.btn-outline[b-wmqb6trh8k] {
    background: white;
    color: #6c757d;
    border: 1px solid #dee2e6;
}

.btn-outline:hover:not(:disabled)[b-wmqb6trh8k] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.btn-secondary[b-wmqb6trh8k] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-wmqb6trh8k] {
    background: #5a6268;
}

.btn-block[b-wmqb6trh8k] {
    width: 100%;
}

/* Spinner Animation */
.spinner[b-wmqb6trh8k] {
    animation: spin-b-wmqb6trh8k 1s linear infinite;
}

@keyframes spin-b-wmqb6trh8k {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Video Matching Section */
.video-matching-section[b-wmqb6trh8k] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 24px;
    margin-top: 32px;
}

.section-header[b-wmqb6trh8k] {
    margin-bottom: 24px;
}

.section-header h2[b-wmqb6trh8k] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.section-header p[b-wmqb6trh8k] {
    font-size: 0.9375rem;
    color: #6c757d;
    margin: 0;
}

/* Candidates List */
.candidates-list[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 24px;
}

.candidate-card[b-wmqb6trh8k] {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 20px;
}

.candidate-header[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #dee2e6;
}

.candidate-header h3[b-wmqb6trh8k] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.candidate-email[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #6c757d;
}

.candidate-position[b-wmqb6trh8k] {
    font-size: 0.875rem;
    color: #007bff;
    font-weight: 500;
}

.video-responses h4[b-wmqb6trh8k] {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

.video-response-item[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    margin-bottom: 12px;
}

.video-info[b-wmqb6trh8k] {
    flex: 1;
    min-width: 0;
}

.question-text[b-wmqb6trh8k] {
    display: block;
    font-weight: 500;
    color: #212529;
    margin-bottom: 4px;
}

.question-type[b-wmqb6trh8k] {
    display: inline-block;
    padding: 2px 8px;
    background: #e7f3ff;
    color: #0288d1;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
}

.video-upload[b-wmqb6trh8k] {
    flex-shrink: 0;
}

.upload-success[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 6px;
    font-size: 0.875rem;
    color: #155724;
}

.success-icon[b-wmqb6trh8k]::before {
    content: '✓';
    font-weight: bold;
}

.no-videos[b-wmqb6trh8k] {
    text-align: center;
    padding: 32px;
    color: #6c757d;
    font-style: italic;
}

/* Matching Actions */
.matching-actions[b-wmqb6trh8k] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 24px;
    border-top: 1px solid #dee2e6;
}

/* Preview Card */
.preview-card[b-wmqb6trh8k] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin-top: 32px;
    overflow: hidden;
}

.table-container[b-wmqb6trh8k] {
    overflow-x: auto;
    margin-bottom: 20px;
}

.modern-table[b-wmqb6trh8k] {
    width: 100%;
    border-collapse: collapse;
}

.modern-table thead[b-wmqb6trh8k] {
    background: #f8f9fa;
}

.modern-table th[b-wmqb6trh8k] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #212529;
    border-bottom: 2px solid #dee2e6;
    font-size: 0.875rem;
}

.modern-table td[b-wmqb6trh8k] {
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
    font-size: 0.875rem;
    color: #495057;
}

.modern-table tbody tr:hover[b-wmqb6trh8k] {
    background: #f8f9fa;
}

.preview-info[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 6px;
    margin: 0 24px 20px 24px;
    font-size: 0.875rem;
    color: #856404;
}

.preview-actions[b-wmqb6trh8k] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 24px;
    border-top: 1px solid #e9ecef;
}

/* Responsive Design */
@media (max-width: 1199px) {
    .content-grid[b-wmqb6trh8k] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .page-container[b-wmqb6trh8k] {
        padding: 16px;
    }

    .page-title[b-wmqb6trh8k] {
        font-size: 1.5rem;
    }

    .content-grid[b-wmqb6trh8k] {
        gap: 16px;
    }

    .card-header[b-wmqb6trh8k] {
        padding: 20px;
    }

    .card-content[b-wmqb6trh8k] {
        padding: 20px;
    }

    .form-row[b-wmqb6trh8k] {
        grid-template-columns: 1fr;
    }

    .file-actions[b-wmqb6trh8k] {
        flex-direction: column;
    }

    .matching-actions[b-wmqb6trh8k],
    .preview-actions[b-wmqb6trh8k] {
        flex-direction: column;
    }

    .btn[b-wmqb6trh8k] {
        width: 100%;
    }
}

@media (max-width: 479px) {
    .page-container[b-wmqb6trh8k] {
        padding: 12px;
    }

    .breadcrumbs[b-wmqb6trh8k] {
        font-size: 12px;
    }

    .page-title[b-wmqb6trh8k] {
        font-size: 1.25rem;
    }

    .card-header[b-wmqb6trh8k] {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
    }

    .card-content[b-wmqb6trh8k] {
        padding: 16px;
    }

    .video-response-item[b-wmqb6trh8k] {
        flex-direction: column;
        align-items: stretch;
    }

    .question-slot-card[b-wmqb6trh8k] {
        flex-direction: column;
    }

    .question-slot-header[b-wmqb6trh8k] {
        flex-direction: column;
        align-items: stretch;
    }

    .question-controls[b-wmqb6trh8k] {
        flex-direction: column;
        width: 100%;
    }

    .btn-toggle-mode[b-wmqb6trh8k] {
        width: 100%;
    }

    .position-filter-toggle[b-wmqb6trh8k] {
        padding: 6px 10px;
    }

    .toggle-label[b-wmqb6trh8k] {
        font-size: 0.8125rem;
    }
}

/* Question Slot Card Styles */
.question-slot-card[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    margin-bottom: 16px;
}

.question-slot-header[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e9ecef;
}

.question-number[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #007bff;
    color: white;
    border-radius: 8px;
    font-weight: 600;
    font-size: 1rem;
    flex-shrink: 0;
}

.question-controls[b-wmqb6trh8k] {
    display: flex;
    gap: 8px;
    flex: 1;
    justify-content: flex-end;
}

.btn-toggle-mode[b-wmqb6trh8k] {
    padding: 8px 16px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: white;
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-toggle-mode:hover[b-wmqb6trh8k] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.btn-toggle-mode.active[b-wmqb6trh8k] {
    background: #007bff;
    color: white;
    border-color: #007bff;
}

.question-content[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.question-text[b-wmqb6trh8k] {
    font-size: 1rem;
    color: #212529;
    line-height: 1.5;
    margin: 0;
}

.question-text.selected[b-wmqb6trh8k] {
    font-weight: 500;
    color: #0056b3;
}

.question-badge[b-wmqb6trh8k] {
    display: inline-block;
    padding: 4px 12px;
    background: #e7f3ff;
    color: #0288d1;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.question-badge.alternate[b-wmqb6trh8k] {
    background: #fff3e0;
    color: #f57c00;
}

/* Alternative Question Selector */
.alternative-question-selector[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 6px;
}

/* Video Upload Section */
.video-upload-section[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.file-input-hidden[b-wmqb6trh8k] {
    display: none;
}

.file-input-label[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    background: #007bff;
    color: white;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
}

.file-input-label:hover[b-wmqb6trh8k] {
    background: #0056b3;
}

.upload-success[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 6px;
    font-size: 0.875rem;
    color: #155724;
}

.upload-success svg[b-wmqb6trh8k] {
    color: #28a745;
    flex-shrink: 0;
}

.btn-remove-file[b-wmqb6trh8k] {
    padding: 4px;
    background: transparent;
    border: none;
    color: #dc3545;
    cursor: pointer;
    transition: all 0.2s;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-remove-file:hover[b-wmqb6trh8k] {
    background: rgba(220, 53, 69, 0.1);
}

/* Questions Section */
.questions-section[b-wmqb6trh8k] {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #e9ecef;
}

.questions-section-title[b-wmqb6trh8k] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 20px 0;
}

.questions-list[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.question-upload-item[b-wmqb6trh8k] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 16px;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
}

.question-info[b-wmqb6trh8k] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.question-number[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #007bff;
    color: white;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.question-text[b-wmqb6trh8k] {
    font-size: 0.9375rem;
    color: #212529;
    line-height: 1.5;
    margin: 0;
    flex: 1;
}

.video-upload-control[b-wmqb6trh8k] {
    flex-shrink: 0;
    min-width: 200px;
}

/* Video Upload Box */
.video-upload-box[b-wmqb6trh8k] {
    position: relative;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    background: white;
    transition: all 0.2s;
    cursor: pointer;
    overflow: hidden;
}

.video-upload-box:hover[b-wmqb6trh8k] {
    border-color: #007bff;
    background: #f8f9ff;
}

.video-file-input[b-wmqb6trh8k] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.video-upload-label[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 24px 20px;
    cursor: pointer;
    pointer-events: none;
    position: relative;
    z-index: 1;
}

.upload-icon-wrapper[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: #e7f3ff;
    border-radius: 50%;
    color: #007bff;
}

.upload-icon[b-wmqb6trh8k] {
    flex-shrink: 0;
}

.upload-text-content[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
}

.upload-title[b-wmqb6trh8k] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #212529;
}

.upload-subtitle[b-wmqb6trh8k] {
    font-size: 0.8125rem;
    color: #6c757d;
}

/* File Selected Box */
.file-selected-box[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 8px;
}

.file-selected-content[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
}

.check-icon[b-wmqb6trh8k] {
    color: #28a745;
    flex-shrink: 0;
}

.file-info[b-wmqb6trh8k] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.file-name[b-wmqb6trh8k] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #155724;
    word-break: break-all;
}

.file-status[b-wmqb6trh8k] {
    font-size: 0.75rem;
    color: #28a745;
}

.loading-questions[b-wmqb6trh8k] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 32px;
    color: #6c757d;
}

.no-questions-message[b-wmqb6trh8k] {
    text-align: center;
    padding: 32px;
    color: #6c757d;
    font-style: italic;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Legacy/LegacyClientImport.razor.rz.scp.css */
/* LegacyClientImport.razor.css - Scoped Styles */

/* Page Container */
.page-container[b-6ybagiplcx] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Breadcrumbs */
.breadcrumbs[b-6ybagiplcx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    padding: 8px 0;
}

.breadcrumb-link[b-6ybagiplcx] {
    display: flex;
    align-items: center;
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
}

.breadcrumb-link:hover[b-6ybagiplcx] {
    color: #007bff;
}

.breadcrumb-current[b-6ybagiplcx] {
    color: #212529;
    font-weight: 500;
    font-size: 14px;
}

.breadcrumb-separator[b-6ybagiplcx] {
    color: #adb5bd;
    flex-shrink: 0;
}

/* Page Header */
.page-header[b-6ybagiplcx] {
    margin-bottom: 32px;
}

.page-header-content[b-6ybagiplcx] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.page-title[b-6ybagiplcx] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.page-subtitle[b-6ybagiplcx] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

/* Content Grid */
.content-grid[b-6ybagiplcx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 24px;
    margin-bottom: 32px;
}

/* Card Styles */
.card[b-6ybagiplcx] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.card-header[b-6ybagiplcx] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px;
    border-bottom: 1px solid #e9ecef;
}

.card-icon[b-6ybagiplcx] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.card-icon.csv-icon[b-6ybagiplcx] {
    background: #e3f2fd;
    color: #1976d2;
}

.card-icon.manual-icon[b-6ybagiplcx] {
    background: #fff3e0;
    color: #f57c00;
}

.card-icon.preview-icon[b-6ybagiplcx] {
    background: #e8f5e9;
    color: #2e7d32;
}

.card-header-text[b-6ybagiplcx] {
    flex: 1;
    min-width: 0;
}

.card-title[b-6ybagiplcx] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.card-description[b-6ybagiplcx] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.card-content[b-6ybagiplcx] {
    padding: 24px;
}

/* File Upload Zone */
.file-upload-zone[b-6ybagiplcx] {
    position: relative;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 48px 24px;
    text-align: center;
    background: #f8f9fa;
    transition: all 0.2s;
    cursor: pointer;
    margin-bottom: 20px;
    overflow: hidden;
}

.file-upload-zone:hover[b-6ybagiplcx] {
    border-color: #007bff;
    background: #e7f3ff;
}

.file-upload-zone.has-file[b-6ybagiplcx] {
    border-color: #28a745;
    background: #f0f9f3;
}

.file-input[b-6ybagiplcx] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
    font-size: 0; /* Hide any text */
    color: transparent; /* Make text transparent */
}

/* Hide the default file input button completely */
.file-input[b-6ybagiplcx]::file-selector-button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-6ybagiplcx]::-webkit-file-upload-button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-6ybagiplcx]::-ms-browse {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-6ybagiplcx]::before {
    display: none !important;
}

.file-input[b-6ybagiplcx]::after {
    display: none !important;
}

.file-upload-label[b-6ybagiplcx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    pointer-events: none;
    position: relative;
    z-index: 1;
}

.upload-icon[b-6ybagiplcx],
.file-check-icon[b-6ybagiplcx] {
    color: #6c757d;
    flex-shrink: 0;
}

.file-check-icon[b-6ybagiplcx] {
    color: #28a745;
}

.upload-text[b-6ybagiplcx] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}

.upload-title[b-6ybagiplcx] {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.upload-subtitle[b-6ybagiplcx] {
    font-size: 0.875rem;
    color: #6c757d;
}

.file-name-display[b-6ybagiplcx] {
    font-size: 1rem;
    font-weight: 600;
    color: #155724;
    word-break: break-all;
    text-align: center;
}

.file-size-display[b-6ybagiplcx] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* File Actions */
.file-actions[b-6ybagiplcx] {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

/* Info Box */
.info-box[b-6ybagiplcx] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    background: #e7f3ff;
    border: 1px solid #b3d9ff;
    border-radius: 8px;
    font-size: 0.875rem;
}

.info-icon[b-6ybagiplcx] {
    color: #0288d1;
    flex-shrink: 0;
    margin-top: 2px;
}

.info-content[b-6ybagiplcx] {
    flex: 1;
    color: #495057;
}

.info-content strong[b-6ybagiplcx] {
    color: #212529;
}

/* Form Styles */
.form-modern[b-6ybagiplcx] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.form-group[b-6ybagiplcx] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0; /* Prevents overflow */
}

.form-row[b-6ybagiplcx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    width: 100%;
}

.form-label-modern[b-6ybagiplcx] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
    display: flex;
    align-items: center;
    gap: 4px;
}

.required-mark[b-6ybagiplcx] {
    color: #dc3545;
}

.form-input-modern[b-6ybagiplcx],
.form-select-modern[b-6ybagiplcx] {
    width: 100%;
    max-width: 100%;
    padding: 10px 14px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.9375rem;
    transition: all 0.2s;
    background: white;
    box-sizing: border-box;
}

.form-input-modern:focus[b-6ybagiplcx],
.form-select-modern:focus[b-6ybagiplcx] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-input-modern[b-6ybagiplcx]::placeholder {
    color: #adb5bd;
}

/* Validation Styles */
.input-invalid[b-6ybagiplcx] {
    border-color: #dc3545 !important;
}

.input-invalid:focus[b-6ybagiplcx] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1) !important;
}

.validation-error[b-6ybagiplcx] {
    display: block;
    font-size: 0.8125rem;
    color: #dc3545;
    margin-top: 4px;
    font-weight: 500;
}

.input-with-icon[b-6ybagiplcx] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 100%;
}

.input-icon[b-6ybagiplcx] {
    position: absolute;
    left: 12px;
    color: #6c757d;
    pointer-events: none;
    flex-shrink: 0;
}

.form-input-modern.has-icon[b-6ybagiplcx] {
    padding-left: 40px;
}

/* Buttons */
.btn[b-6ybagiplcx] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.btn-primary[b-6ybagiplcx] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-6ybagiplcx] {
    background: #0056b3;
}

.btn-primary:disabled[b-6ybagiplcx] {
    background: #6c757d;
    cursor: not-allowed;
    opacity: 0.6;
}

.btn-outline[b-6ybagiplcx] {
    background: white;
    color: #6c757d;
    border: 1px solid #dee2e6;
}

.btn-outline:hover:not(:disabled)[b-6ybagiplcx] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.btn-block[b-6ybagiplcx] {
    width: 100%;
}

/* Spinner Animation */
.spinner[b-6ybagiplcx] {
    animation: spin-b-6ybagiplcx 1s linear infinite;
}

@keyframes spin-b-6ybagiplcx {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Preview Card */
.preview-card[b-6ybagiplcx] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin-top: 32px;
    overflow: hidden;
}

.table-container[b-6ybagiplcx] {
    overflow-x: auto;
    margin-bottom: 20px;
}

.modern-table[b-6ybagiplcx] {
    width: 100%;
    border-collapse: collapse;
}

.modern-table thead[b-6ybagiplcx] {
    background: #f8f9fa;
}

.modern-table th[b-6ybagiplcx] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #212529;
    border-bottom: 2px solid #dee2e6;
    font-size: 0.875rem;
    white-space: nowrap;
}

.modern-table td[b-6ybagiplcx] {
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
    font-size: 0.875rem;
    color: #495057;
}

.modern-table tbody tr:hover[b-6ybagiplcx] {
    background: #f8f9fa;
}

.preview-info[b-6ybagiplcx] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 6px;
    margin: 0 24px 20px 24px;
    font-size: 0.875rem;
    color: #856404;
}

.preview-actions[b-6ybagiplcx] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 24px;
    border-top: 1px solid #e9ecef;
}

/* Responsive Design */
@media (max-width: 1199px) {
    .content-grid[b-6ybagiplcx] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .page-container[b-6ybagiplcx] {
        padding: 16px;
    }

    .page-title[b-6ybagiplcx] {
        font-size: 1.5rem;
    }

    .content-grid[b-6ybagiplcx] {
        gap: 16px;
    }

    .card-header[b-6ybagiplcx] {
        padding: 20px;
    }

    .card-content[b-6ybagiplcx] {
        padding: 20px;
    }

    .form-row[b-6ybagiplcx] {
        grid-template-columns: 1fr;
    }

    .file-actions[b-6ybagiplcx] {
        flex-direction: column;
    }

    .preview-actions[b-6ybagiplcx] {
        flex-direction: column;
    }

    .btn[b-6ybagiplcx] {
        width: 100%;
    }
}

@media (max-width: 479px) {
    .page-container[b-6ybagiplcx] {
        padding: 12px;
    }

    .breadcrumbs[b-6ybagiplcx] {
        font-size: 12px;
    }

    .page-title[b-6ybagiplcx] {
        font-size: 1.25rem;
    }

    .card-header[b-6ybagiplcx] {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
    }

    .card-content[b-6ybagiplcx] {
        padding: 16px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Legacy/LegacyImport.razor.rz.scp.css */
/* LegacyImport.razor.css - Scoped Styles */

/* Page Layout */
.page-container[b-gxfs85eahd] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Breadcrumbs */
.breadcrumbs[b-gxfs85eahd] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    padding: 8px 0;
}

.breadcrumb-item[b-gxfs85eahd] {
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
}

.breadcrumb-item:hover:not(.disabled)[b-gxfs85eahd] {
    color: #007bff;
}

.breadcrumb-item.disabled[b-gxfs85eahd] {
    color: #212529;
    font-weight: 500;
}

.breadcrumb-separator[b-gxfs85eahd] {
    color: #adb5bd;
}

/* Page Title */
.page-title[b-gxfs85eahd] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.page-subtitle[b-gxfs85eahd] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0 0 32px 0;
}

/* Quick Start Section */
.quick-start-section[b-gxfs85eahd] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 24px;
    margin-bottom: 32px;
}

.quick-start-section h2[b-gxfs85eahd] {
    margin: 0 0 24px 0;
    color: #212529;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 600;
}

.steps-grid[b-gxfs85eahd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
}

.step[b-gxfs85eahd] {
    text-align: center;
    padding: 20px 16px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: all 0.2s;
}

.step:hover[b-gxfs85eahd] {
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.step-number[b-gxfs85eahd] {
    width: 40px;
    height: 40px;
    background: #007bff;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 1.125rem;
    margin: 0 auto 12px auto;
}

.step h4[b-gxfs85eahd] {
    margin: 0 0 8px 0;
    color: #212529;
    font-size: 0.9375rem;
    font-weight: 600;
}

.step p[b-gxfs85eahd] {
    margin: 0;
    color: #6c757d;
    font-size: 0.8125rem;
    line-height: 1.4;
}

/* Import Options Grid */
.import-grid[b-gxfs85eahd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;
    margin: 0;
}

.import-card[b-gxfs85eahd] {
    background: white;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
    transition: all 0.2s ease;
    cursor: pointer;
    text-align: center;
}

.import-card:hover[b-gxfs85eahd] {
    border-color: #007bff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 123, 255, 0.15);
}

.import-icon[b-gxfs85eahd] {
    font-size: 3rem;
    margin-bottom: 16px;
    color: #007bff;
}

.import-card h3[b-gxfs85eahd] {
    margin: 0 0 12px 0;
    color: #212529;
    font-size: 1.125rem;
    font-weight: 600;
}

.import-card p[b-gxfs85eahd] {
    margin: 0 0 16px 0;
    color: #6c757d;
    line-height: 1.5;
    font-size: 0.875rem;
}

.import-features[b-gxfs85eahd] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
}

.feature-tag[b-gxfs85eahd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 16px;
    font-size: 0.75rem;
    font-weight: 600;
    color: white;
    background: #0288d1;
}

/* Loading Spinner Animation */
@keyframes spin-b-gxfs85eahd {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Responsive Design */
@media (max-width: 767px) {
    .page-container[b-gxfs85eahd] {
        padding: 16px;
    }

    .page-title[b-gxfs85eahd] {
        font-size: 1.5rem;
    }

    .quick-start-section[b-gxfs85eahd] {
        padding: 20px;
        margin-bottom: 24px;
    }

    .quick-start-section h2[b-gxfs85eahd] {
        font-size: 1.25rem;
        margin-bottom: 20px;
    }

    .steps-grid[b-gxfs85eahd] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .step[b-gxfs85eahd] {
        padding: 16px;
    }

    .import-grid[b-gxfs85eahd] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

@media (max-width: 479px) {
    .page-container[b-gxfs85eahd] {
        padding: 12px;
    }

    .breadcrumbs[b-gxfs85eahd] {
        font-size: 12px;
    }

    .page-title[b-gxfs85eahd] {
        font-size: 1.25rem;
    }

    .quick-start-section[b-gxfs85eahd] {
        padding: 16px;
    }

    .import-card[b-gxfs85eahd] {
        padding: 20px;
    }

    .import-icon[b-gxfs85eahd] {
        font-size: 2.5rem;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Legacy/LegacyPositionImport.razor.rz.scp.css */
/* LegacyPositionImport.razor.css - Scoped Styles */

/* Page Container */
.page-container[b-gdza4oornw] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Breadcrumbs */
.breadcrumbs[b-gdza4oornw] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    padding: 8px 0;
}

.breadcrumb-link[b-gdza4oornw] {
    display: flex;
    align-items: center;
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
}

.breadcrumb-link:hover[b-gdza4oornw] {
    color: #007bff;
}

.breadcrumb-current[b-gdza4oornw] {
    color: #212529;
    font-weight: 500;
    font-size: 14px;
}

.breadcrumb-separator[b-gdza4oornw] {
    color: #adb5bd;
    flex-shrink: 0;
}

/* Page Header */
.page-header[b-gdza4oornw] {
    margin-bottom: 32px;
}

.page-header-content[b-gdza4oornw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.page-title[b-gdza4oornw] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.page-subtitle[b-gdza4oornw] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

/* Content Grid */
.content-grid[b-gdza4oornw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 24px;
    margin-bottom: 32px;
}

/* Card Styles */
.card[b-gdza4oornw] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: visible; /* Allow dropdowns to escape card bounds */
}

.card-header[b-gdza4oornw] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px;
    border-bottom: 1px solid #e9ecef;
}

.card-icon[b-gdza4oornw] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.card-icon.csv-icon[b-gdza4oornw] {
    background: #e3f2fd;
    color: #1976d2;
}

.card-icon.manual-icon[b-gdza4oornw] {
    background: #fff3e0;
    color: #f57c00;
}

.card-icon.preview-icon[b-gdza4oornw] {
    background: #e8f5e9;
    color: #2e7d32;
}

.card-header-text[b-gdza4oornw] {
    flex: 1;
    min-width: 0;
}

.card-title[b-gdza4oornw] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.card-description[b-gdza4oornw] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.card-content[b-gdza4oornw] {
    padding: 24px;
    overflow: visible; /* Allow dropdowns to render outside */
}

/* File Upload Zone */
.file-upload-zone[b-gdza4oornw] {
    position: relative;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 48px 24px;
    text-align: center;
    background: #f8f9fa;
    transition: all 0.2s;
    cursor: pointer;
    margin-bottom: 20px;
    overflow: hidden;
}

.file-upload-zone:hover[b-gdza4oornw] {
    border-color: #007bff;
    background: #e7f3ff;
}

.file-upload-zone.has-file[b-gdza4oornw] {
    border-color: #28a745;
    background: #f0f9f3;
}

.file-input[b-gdza4oornw] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
    font-size: 0; /* Hide any text */
    color: transparent; /* Make text transparent */
}

/* Hide the default file input button completely */
.file-input[b-gdza4oornw]::file-selector-button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-gdza4oornw]::-webkit-file-upload-button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-gdza4oornw]::-ms-browse {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.file-input[b-gdza4oornw]::before {
    display: none !important;
}

.file-input[b-gdza4oornw]::after {
    display: none !important;
}

.file-upload-label[b-gdza4oornw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    pointer-events: none;
    position: relative;
    z-index: 1;
}

.upload-icon[b-gdza4oornw],
.file-check-icon[b-gdza4oornw] {
    color: #6c757d;
    flex-shrink: 0;
}

.file-check-icon[b-gdza4oornw] {
    color: #28a745;
}

.upload-text[b-gdza4oornw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}

.upload-title[b-gdza4oornw] {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.upload-subtitle[b-gdza4oornw] {
    font-size: 0.875rem;
    color: #6c757d;
}

.file-name-display[b-gdza4oornw] {
    font-size: 1rem;
    font-weight: 600;
    color: #155724;
    word-break: break-all;
    text-align: center;
}

.file-size-display[b-gdza4oornw] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* File Actions */
.file-actions[b-gdza4oornw] {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

/* Info Box */
.info-box[b-gdza4oornw] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    background: #e7f3ff;
    border: 1px solid #b3d9ff;
    border-radius: 8px;
    font-size: 0.875rem;
}

.info-icon[b-gdza4oornw] {
    color: #0288d1;
    flex-shrink: 0;
    margin-top: 2px;
}

.info-content[b-gdza4oornw] {
    flex: 1;
    color: #495057;
}

.info-content strong[b-gdza4oornw] {
    color: #212529;
}

/* Form Styles */
.form-modern[b-gdza4oornw] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    overflow: visible; /* Allow dropdowns to render outside */
}

.form-group[b-gdza4oornw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0; /* Prevents overflow */
    position: relative; /* For dropdown positioning */
}

.form-row[b-gdza4oornw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    width: 100%;
    overflow: visible; /* Allow dropdowns to render outside */
}

.form-label-modern[b-gdza4oornw] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
    display: flex;
    align-items: center;
    gap: 4px;
}

.required-mark[b-gdza4oornw] {
    color: #dc3545;
}

.form-input-modern[b-gdza4oornw],
.form-select-modern[b-gdza4oornw],
.form-textarea-modern[b-gdza4oornw] {
    width: 100%;
    max-width: 100%;
    padding: 10px 14px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.9375rem;
    transition: all 0.2s;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
}

.form-textarea-modern[b-gdza4oornw] {
    resize: vertical;
    line-height: 1.5;
}

.form-input-modern:focus[b-gdza4oornw],
.form-select-modern:focus[b-gdza4oornw],
.form-textarea-modern:focus[b-gdza4oornw] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-input-modern[b-gdza4oornw]::placeholder,
.form-textarea-modern[b-gdza4oornw]::placeholder {
    color: #adb5bd;
}

.input-with-icon[b-gdza4oornw] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 100%;
}

.input-icon[b-gdza4oornw] {
    position: absolute;
    left: 12px;
    color: #6c757d;
    pointer-events: none;
    flex-shrink: 0;
}

.form-input-modern.has-icon[b-gdza4oornw] {
    padding-left: 40px;
}

/* Searchable Dropdown */
.searchable-dropdown[b-gdza4oornw] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: 300px;
    overflow-y: auto;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    margin-top: 4px;
    z-index: 1000;
}

.searchable-dropdown.dropdown-up[b-gdza4oornw] {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 4px;
    border-radius: 6px;
}

.dropdown-search-container[b-gdza4oornw] {
    padding: 8px;
    border-bottom: 1px solid #dee2e6;
    background: #f8f9fa;
}

.dropdown-search-input[b-gdza4oornw] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    font-size: 0.875rem;
}

.dropdown-search-input:focus[b-gdza4oornw] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.1);
}

.dropdown-item[b-gdza4oornw] {
    padding: 12px 16px;
    cursor: pointer;
    transition: background-color 0.2s;
    border-bottom: 1px solid #f8f9fa;
}

.dropdown-item:last-child[b-gdza4oornw] {
    border-bottom: none;
}

.dropdown-item:hover[b-gdza4oornw] {
    background: #f8f9fa;
}

.dropdown-item.selected[b-gdza4oornw] {
    background-color: #e7f3ff;
    color: #007bff;
    font-weight: 600;
}

.selected-value[b-gdza4oornw] {
    margin-top: 8px;
    padding: 8px 12px;
    background-color: #e7f3ff;
    border-radius: 6px;
    font-size: 0.8125rem;
    color: #007bff;
    font-weight: 500;
    border: 1px solid rgba(0, 123, 255, 0.2);
}

.form-group[b-gdza4oornw] {
    position: relative;
}

.client-name[b-gdza4oornw] {
    font-weight: 600;
    color: #212529;
    font-size: 0.9375rem;
    margin-bottom: 2px;
}

.client-company[b-gdza4oornw] {
    font-size: 0.8125rem;
    color: #6c757d;
}

/* Selected Client Display */
.selected-client-display[b-gdza4oornw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: #e7f3ff;
    border: 1px solid #b3d9ff;
    border-radius: 6px;
    margin-top: 8px;
    font-size: 0.875rem;
    color: #0056b3;
}

.selected-client-display strong[b-gdza4oornw] {
    color: #004085;
}

.btn-clear-selection[b-gdza4oornw] {
    background: transparent;
    border: none;
    color: #6c757d;
    cursor: pointer;
    font-size: 1.5rem;
    line-height: 1;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s;
}

.btn-clear-selection:hover[b-gdza4oornw] {
    background: rgba(0, 0, 0, 0.1);
    color: #dc3545;
}

/* Buttons */
.btn[b-gdza4oornw] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.btn-primary[b-gdza4oornw] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-gdza4oornw] {
    background: #0056b3;
}

.btn-primary:disabled[b-gdza4oornw] {
    background: #6c757d;
    cursor: not-allowed;
    opacity: 0.6;
}

.btn-outline[b-gdza4oornw] {
    background: white;
    color: #6c757d;
    border: 1px solid #dee2e6;
}

.btn-outline:hover:not(:disabled)[b-gdza4oornw] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.btn-block[b-gdza4oornw] {
    width: 100%;
}

/* Spinner Animation */
.spinner[b-gdza4oornw] {
    animation: spin-b-gdza4oornw 1s linear infinite;
}

@keyframes spin-b-gdza4oornw {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Preview Card */
.preview-card[b-gdza4oornw] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin-top: 32px;
    overflow: hidden;
}

.table-container[b-gdza4oornw] {
    overflow-x: auto;
    margin-bottom: 20px;
}

.modern-table[b-gdza4oornw] {
    width: 100%;
    border-collapse: collapse;
}

.modern-table thead[b-gdza4oornw] {
    background: #f8f9fa;
}

.modern-table th[b-gdza4oornw] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #212529;
    border-bottom: 2px solid #dee2e6;
    font-size: 0.875rem;
    white-space: nowrap;
}

.modern-table td[b-gdza4oornw] {
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
    font-size: 0.875rem;
    color: #495057;
}

.modern-table tbody tr:hover[b-gdza4oornw] {
    background: #f8f9fa;
}

.preview-info[b-gdza4oornw] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 6px;
    margin: 0 24px 20px 24px;
    font-size: 0.875rem;
    color: #856404;
}

.preview-actions[b-gdza4oornw] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 24px;
    border-top: 1px solid #e9ecef;
}

/* Responsive Design */
@media (max-width: 1199px) {
    .content-grid[b-gdza4oornw] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .page-container[b-gdza4oornw] {
        padding: 16px;
    }

    .page-title[b-gdza4oornw] {
        font-size: 1.5rem;
    }

    .content-grid[b-gdza4oornw] {
        gap: 16px;
    }

    .card-header[b-gdza4oornw] {
        padding: 20px;
    }

    .card-content[b-gdza4oornw] {
        padding: 20px;
    }

    .form-row[b-gdza4oornw] {
        grid-template-columns: 1fr;
    }

    .file-actions[b-gdza4oornw] {
        flex-direction: column;
    }

    .preview-actions[b-gdza4oornw] {
        flex-direction: column;
    }

    .btn[b-gdza4oornw] {
        width: 100%;
    }
}

/* Searchable Dropdown Styles */
.searchable-dropdown-wrapper[b-gdza4oornw] {
    position: relative;
    width: 100%;
}

.searchable-dropdown-button[b-gdza4oornw] {
    width: 100%;
    padding: 12px 40px 12px 16px;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9375rem;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
    color: #212529;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    transition: all 0.2s ease;
    min-height: 48px;
}

.searchable-dropdown-button:hover[b-gdza4oornw] {
    border-color: #adb5bd;
    background: #fafbfc;
}

.searchable-dropdown-button:focus[b-gdza4oornw] {
    outline: none;
    border-color: #007bff;
    background: white;
    box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.1);
}

.searchable-dropdown-button.open[b-gdza4oornw] {
    border-color: #007bff;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.dropdown-selected-text[b-gdza4oornw] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dropdown-arrow[b-gdza4oornw] {
    color: #6b7280;
    font-size: 0.75rem;
    margin-left: 8px;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.searchable-dropdown-button.open .dropdown-arrow[b-gdza4oornw] {
    transform: rotate(180deg);
}

.searchable-dropdown-menu[b-gdza4oornw] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 2px solid #007bff;
    border-top: none;
    border-radius: 0 0 8px 8px;
    z-index: 9999;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    max-height: 350px;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

/* Removed conflicting z-index rules - handled by component CSS */

.dropdown-search-container[b-gdza4oornw] {
    position: relative;
    padding: 12px;
    border-bottom: 1px solid #e9ecef;
}

.dropdown-search-input[b-gdza4oornw] {
    width: 100%;
    padding: 10px 32px 10px 12px;
    border: 1px solid #e1e5e9;
    border-radius: 6px;
    font-size: 0.875rem;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
    color: #212529;
    transition: all 0.2s ease;
}

.dropdown-search-input:focus[b-gdza4oornw] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.search-icon[b-gdza4oornw] {
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-size: 0.875rem;
    pointer-events: none;
}

.dropdown-list[b-gdza4oornw] {
    max-height: 280px;
    overflow-y: auto;
    padding: 4px 0;
}

/* Field Help Text */
.field-help[b-gdza4oornw] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin-top: 6px;
    margin-bottom: 0;
    line-height: 1.4;
}

/* Dropdown No Results */
.dropdown-no-results[b-gdza4oornw] {
    padding: 16px;
    text-align: center;
    color: #6c757d;
    font-size: 0.875rem;
    font-style: italic;
}

/* Scrollbar styling for dropdown list */
.dropdown-list[b-gdza4oornw]::-webkit-scrollbar {
    width: 6px;
}

.dropdown-list[b-gdza4oornw]::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.dropdown-list[b-gdza4oornw]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.dropdown-list[b-gdza4oornw]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

@media (max-width: 479px) {
    .page-container[b-gdza4oornw] {
        padding: 12px;
    }

    .breadcrumbs[b-gdza4oornw] {
        font-size: 12px;
    }

    .page-title[b-gdza4oornw] {
        font-size: 1.25rem;
    }

    .card-header[b-gdza4oornw] {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
    }

    .card-content[b-gdza4oornw] {
        padding: 16px;
    }

    .position-filter-toggle[b-gdza4oornw] {
        padding: 6px 10px;
    }

    .toggle-label[b-gdza4oornw] {
        font-size: 0.8125rem;
    }
}

/* Filter Toggle Section */
.filter-toggle-section[b-gdza4oornw] {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 20px;
    padding: 12px 16px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    flex-wrap: wrap;
}

.toggle-group[b-gdza4oornw] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.position-filter-toggle[b-gdza4oornw] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    padding: 8px 12px;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #e9ecef;
}

.form-hint[b-gdza4oornw] {
    display: block;
    font-size: 0.8125rem;
    color: #6c757d;
    margin-top: 6px;
    font-style: italic;
}

.toggle-switch[b-gdza4oornw] {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 24px;
    margin: 0;
    cursor: pointer;
}

.toggle-switch input[b-gdza4oornw] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-gdza4oornw] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.3s;
    border-radius: 24px;
}

.toggle-slider[b-gdza4oornw]:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
}

.toggle-switch input:checked + .toggle-slider[b-gdza4oornw] {
    background-color: #007bff;
}

.toggle-switch input:checked + .toggle-slider[b-gdza4oornw]:before {
    transform: translateX(24px);
}

.toggle-label[b-gdza4oornw] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
    user-select: none;
}

/* Legacy Badge */
.legacy-badge[b-gdza4oornw] {
    display: inline-block;
    padding: 2px 8px;
    background: #fff3e0;
    color: #f57c00;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-left: 8px;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Legacy/QuestionTemplateImport.razor.rz.scp.css */
/* QuestionTemplateImport.razor.css - Scoped Styles */

/* Page Container */
.page-container[b-l58b4w90x6] {
    padding: 24px;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

/* Page Header */
.page-header[b-l58b4w90x6] {
    margin-bottom: 32px;
}

.page-title[b-l58b4w90x6] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.page-subtitle[b-l58b4w90x6] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
    line-height: 1.5;
}

/* Alert Messages */
.alert[b-l58b4w90x6] {
    padding: 16px 20px;
    border-radius: 8px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.9375rem;
    line-height: 1.5;
}

.alert-icon[b-l58b4w90x6] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.alert-success[b-l58b4w90x6] {
    background: #d4edda;
    border: 2px solid #28a745;
    color: #155724;
}

.alert-danger[b-l58b4w90x6] {
    background: #f8d7da;
    border: 2px solid #dc3545;
    color: #721c24;
}

.alert-warning[b-l58b4w90x6] {
    background: #fff3cd;
    border: 2px solid #ffc107;
    color: #856404;
}

/* Loading & Access Denied */
.loading-container[b-l58b4w90x6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.loading-spinner[b-l58b4w90x6] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-l58b4w90x6 1s linear infinite;
}

.loading-text[b-l58b4w90x6] {
    color: #6c757d;
    margin-top: 16px;
    font-size: 0.9375rem;
}

.access-denied[b-l58b4w90x6] {
    text-align: center;
    padding: 60px 20px;
}

.access-denied-icon[b-l58b4w90x6] {
    font-size: 4rem;
    margin-bottom: 20px;
}

.access-denied-title[b-l58b4w90x6] {
    margin: 0 0 12px 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
}

.access-denied-message[b-l58b4w90x6] {
    color: #6c757d;
    margin-bottom: 24px;
    font-size: 1rem;
}

/* Form Container */
.import-form-container[b-l58b4w90x6] {
    margin-bottom: 32px;
}

.form-card[b-l58b4w90x6] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 32px;
}

/* Form Grid */
.form-grid[b-l58b4w90x6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 8px;
}

.form-field[b-l58b4w90x6] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-l58b4w90x6] {
    grid-column: span 2;
}

.form-field.half-width[b-l58b4w90x6] {
    grid-column: span 1;
}

.form-label[b-l58b4w90x6] {
    display: block;
    font-weight: 600;
    color: #212529;
    margin-bottom: 8px;
    font-size: 0.875rem;
}

.required[b-l58b4w90x6] {
    color: #dc3545;
}

.field-help[b-l58b4w90x6] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin-top: 6px;
    margin-bottom: 0;
    line-height: 1.4;
}

.form-input[b-l58b4w90x6],
.form-textarea[b-l58b4w90x6],
.form-select[b-l58b4w90x6] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9375rem;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
    color: #212529;
}

.form-textarea[b-l58b4w90x6] {
    resize: vertical;
    line-height: 1.6;
    min-height: 100px;
    padding: 14px 16px;
}

.form-select[b-l58b4w90x6] {
    appearance: none;
    padding-right: 16px;
    cursor: pointer;
}

.form-input:hover[b-l58b4w90x6],
.form-textarea:hover[b-l58b4w90x6],
.form-select:hover[b-l58b4w90x6] {
    border-color: #adb5bd;
    background: #fafbfc;
}

.form-input:focus[b-l58b4w90x6],
.form-textarea:focus[b-l58b4w90x6],
.form-select:focus[b-l58b4w90x6] {
    outline: none;
    border-color: #007bff;
    background: white;
    box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.1);
}

.form-input[b-l58b4w90x6]::placeholder,
.form-textarea[b-l58b4w90x6]::placeholder {
    color: #adb5bd;
    font-style: normal;
}

/* Status Section */
.status-section[b-l58b4w90x6] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Questions Section */
.questions-section[b-l58b4w90x6] {
    margin-top: 32px;
    padding-top: 32px;
    border-top: 2px solid #e9ecef;
}

.section-header[b-l58b4w90x6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.section-title[b-l58b4w90x6] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.empty-state-small[b-l58b4w90x6] {
    text-align: center;
    padding: 40px 20px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 2px dashed #dee2e6;
}

.empty-message[b-l58b4w90x6] {
    color: #6c757d;
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.6;
}

.question-item[b-l58b4w90x6] {
    background: #f8f9fa;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 16px;
}

.question-item:hover[b-l58b4w90x6] {
    border-color: #007bff;
    background: white;
}

.question-header[b-l58b4w90x6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.question-number[b-l58b4w90x6] {
    font-size: 1rem;
    font-weight: 600;
    color: #495057;
    margin: 0;
}

.question-fields[b-l58b4w90x6] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.form-row[b-l58b4w90x6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Text Utilities */
.text-danger[b-l58b4w90x6] {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 6px;
    display: block;
}

.text-danger a[b-l58b4w90x6] {
    color: #007bff;
    font-weight: 600;
    text-decoration: underline;
}

.text-danger a:hover[b-l58b4w90x6] {
    color: #0056b3;
}

/* Form Actions */
.form-actions[b-l58b4w90x6] {
    margin-top: 32px;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    padding-top: 24px;
    border-top: 2px solid #e9ecef;
}

/* Buttons */
.btn[b-l58b4w90x6] {
    padding: 12px 24px;
    border: none;
    border-radius: 8px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
}

.btn-primary[b-l58b4w90x6] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-l58b4w90x6] {
    background: #0056b3;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 123, 255, 0.3);
}

.btn-primary:active:not(:disabled)[b-l58b4w90x6] {
    background: #004494;
    transform: translateY(0);
}

.btn-primary:disabled[b-l58b4w90x6] {
    background: #6c757d;
    cursor: not-allowed;
    opacity: 0.6;
}

.btn-secondary[b-l58b4w90x6] {
    background: white;
    color: #495057;
    border: 2px solid #dee2e6;
}

.btn-secondary:hover[b-l58b4w90x6] {
    background: #f8f9fa;
    border-color: #adb5bd;
    transform: translateY(-1px);
}

.btn-secondary:active[b-l58b4w90x6] {
    background: #e9ecef;
    transform: translateY(0);
}

.btn-danger[b-l58b4w90x6] {
    background: #dc3545;
    color: white;
}

.btn-danger:hover[b-l58b4w90x6] {
    background: #c82333;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
}

.btn-danger:active[b-l58b4w90x6] {
    background: #bd2130;
    transform: translateY(0);
}

.btn-sm[b-l58b4w90x6] {
    padding: 8px 16px;
    font-size: 0.8125rem;
}

/* Loading Spinner Small */
.loading-spinner-small[b-l58b4w90x6] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-l58b4w90x6 0.8s linear infinite;
}

/* Success Banner */
.success-banner[b-l58b4w90x6] {
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    border: 2px solid #28a745;
    border-radius: 12px;
    padding: 32px;
    margin-top: 32px;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.2);
    display: flex;
    align-items: center;
    gap: 24px;
}

.success-icon[b-l58b4w90x6] {
    font-size: 3rem;
    flex-shrink: 0;
}

.success-content[b-l58b4w90x6] {
    flex: 1;
}

.success-title[b-l58b4w90x6] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #155724;
    margin: 0 0 8px 0;
}

.success-message[b-l58b4w90x6] {
    color: #155724;
    margin: 0 0 20px 0;
    font-size: 1rem;
    line-height: 1.5;
}

/* Loading Spinner Animation */
@keyframes spin-b-l58b4w90x6 {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Responsive Design */
@media (max-width: 1023px) {
    .form-grid[b-l58b4w90x6] {
        grid-template-columns: 1fr;
    }

    .form-field.full-width[b-l58b4w90x6],
    .form-field.half-width[b-l58b4w90x6] {
        grid-column: span 1;
    }
}

@media (max-width: 767px) {
    .page-container[b-l58b4w90x6] {
        padding: 16px;
    }

    .page-title[b-l58b4w90x6] {
        font-size: 1.5rem;
    }

    .form-card[b-l58b4w90x6] {
        padding: 24px;
        border-radius: 10px;
    }

    .form-row[b-l58b4w90x6] {
        grid-template-columns: 1fr;
    }

    .section-header[b-l58b4w90x6] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .section-header .btn[b-l58b4w90x6] {
        width: 100%;
    }

    .form-actions[b-l58b4w90x6] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-l58b4w90x6] {
        width: 100%;
    }

    .success-banner[b-l58b4w90x6] {
        flex-direction: column;
        text-align: center;
    }
}

/* Searchable Dropdown Styles */
.searchable-dropdown-wrapper[b-l58b4w90x6] {
    position: relative;
    width: 100%;
}

.searchable-dropdown-button[b-l58b4w90x6] {
    width: 100%;
    padding: 12px 40px 12px 16px;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9375rem;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
    color: #212529;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    transition: all 0.2s ease;
    min-height: 48px;
}

.searchable-dropdown-button:hover[b-l58b4w90x6] {
    border-color: #adb5bd;
    background: #fafbfc;
}

.searchable-dropdown-button:focus[b-l58b4w90x6] {
    outline: none;
    border-color: #007bff;
    background: white;
    box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.1);
}

.searchable-dropdown-button.open[b-l58b4w90x6] {
    border-color: #007bff;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.dropdown-selected-text[b-l58b4w90x6] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dropdown-arrow[b-l58b4w90x6] {
    color: #6b7280;
    font-size: 0.75rem;
    margin-left: 8px;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.searchable-dropdown-button.open .dropdown-arrow[b-l58b4w90x6] {
    transform: rotate(180deg);
}

.searchable-dropdown-menu[b-l58b4w90x6] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 2px solid #007bff;
    border-top: none;
    border-radius: 0 0 8px 8px;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    max-height: 350px;
    display: flex;
    flex-direction: column;
}

.dropdown-search-container[b-l58b4w90x6] {
    position: relative;
    padding: 12px;
    border-bottom: 1px solid #e9ecef;
}

.dropdown-search-input[b-l58b4w90x6] {
    width: 100%;
    padding: 10px 32px 10px 12px;
    border: 1px solid #e1e5e9;
    border-radius: 6px;
    font-size: 0.875rem;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
    color: #212529;
    transition: all 0.2s ease;
}

.dropdown-search-input:focus[b-l58b4w90x6] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.search-icon[b-l58b4w90x6] {
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-size: 0.875rem;
    pointer-events: none;
}

.dropdown-list[b-l58b4w90x6] {
    max-height: 280px;
    overflow-y: auto;
    padding: 4px 0;
}

.dropdown-item[b-l58b4w90x6] {
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.9375rem;
    color: #212529;
    user-select: none;
}

.dropdown-item:hover[b-l58b4w90x6] {
    background-color: #f8f9fa;
    color: #007bff;
}

.dropdown-item.selected[b-l58b4w90x6] {
    background-color: #e7f3ff;
    color: #007bff;
    font-weight: 600;
}

.dropdown-no-results[b-l58b4w90x6] {
    padding: 16px;
    text-align: center;
    color: #6c757d;
    font-size: 0.875rem;
    font-style: italic;
}

/* Scrollbar styling for dropdown list */
.dropdown-list[b-l58b4w90x6]::-webkit-scrollbar {
    width: 6px;
}

.dropdown-list[b-l58b4w90x6]::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.dropdown-list[b-l58b4w90x6]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.dropdown-list[b-l58b4w90x6]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

@media (max-width: 479px) {
    .page-container[b-l58b4w90x6] {
        padding: 12px;
    }

    .page-title[b-l58b4w90x6] {
        font-size: 1.25rem;
    }

    .form-card[b-l58b4w90x6] {
        padding: 20px;
        border-radius: 8px;
    }

    .question-item[b-l58b4w90x6] {
        padding: 16px;
    }

    .success-banner[b-l58b4w90x6] {
        padding: 24px;
    }

    .success-icon[b-l58b4w90x6] {
        font-size: 2.5rem;
    }

    .success-title[b-l58b4w90x6] {
        font-size: 1.25rem;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Management/Manage.razor.rz.scp.css */
/* Manage.razor.css - Blazor CSS Isolation */

/* Global Box Sizing */
*[b-qy0kj4grfn] {
    box-sizing: border-box;
}

/* Page Container */
.page-container[b-qy0kj4grfn] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

/* Page Header */
.page-header[b-qy0kj4grfn] {
    margin-bottom: 24px;
}

.page-title[b-qy0kj4grfn] {
    font-size: 1.75rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.page-description[b-qy0kj4grfn] {
    font-size: 0.9375rem;
    color: #6c757d;
    margin: 0;
}

/* Access Denied */
.access-denied[b-qy0kj4grfn] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
}

.access-denied-card[b-qy0kj4grfn] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    padding: 48px;
    text-align: center;
    max-width: 400px;
    width: 100%;
}

.access-denied-icon[b-qy0kj4grfn] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 24px;
}

.access-denied-title[b-qy0kj4grfn] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

.access-denied-message[b-qy0kj4grfn] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0 0 32px 0;
    line-height: 1.5;
}

/* Empty State */
.empty-state[b-qy0kj4grfn] {
    text-align: center;
    padding: 80px 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.empty-state-icon[b-qy0kj4grfn] {
    font-size: 4rem;
    margin-bottom: 24px;
    opacity: 0.6;
}

.empty-state-title[b-qy0kj4grfn] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #495057;
    margin: 0 0 12px 0;
}

.empty-state-message[b-qy0kj4grfn] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
    line-height: 1.6;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

/* Management List */
.management-list[b-qy0kj4grfn] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 900px;
    width: 100%;
    box-sizing: border-box;
}

/* Management Card */
.management-card[b-qy0kj4grfn] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 16px 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    min-height: auto;
    border: 1px solid #e9ecef;
    box-sizing: border-box;
    width: 100%;
}

.management-card:hover[b-qy0kj4grfn] {
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    border-color: #dee2e6;
}

.management-card.disabled[b-qy0kj4grfn] {
    cursor: not-allowed;
    opacity: 0.6;
}

.management-card.disabled:hover[b-qy0kj4grfn] {
    transform: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Management Card Icon */
.management-card-icon[b-qy0kj4grfn] {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}

.management-card-icon.primary[b-qy0kj4grfn] {
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
}

.management-card-icon.success[b-qy0kj4grfn] {
    background: linear-gradient(135deg, #28a745 0%, #1e7e34 100%);
}

.management-card-icon.warning[b-qy0kj4grfn] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
}

.management-card-icon.info[b-qy0kj4grfn] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
}

.icon-emoji[b-qy0kj4grfn] {
    font-size: 24px;
}

/* Management Card Content */
.management-card-content[b-qy0kj4grfn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.management-card-title[b-qy0kj4grfn] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.management-card-description[b-qy0kj4grfn] {
    font-size: 0.8125rem;
    color: #6c757d;
    line-height: 1.4;
    margin: 0;
}

/* Management Card Meta */
.management-card-meta[b-qy0kj4grfn] {
    display: flex;
    gap: 16px;
    margin-top: 2px;
}

.meta-item[b-qy0kj4grfn] {
    font-size: 0.75rem;
    color: #6c757d;
}

.meta-item strong[b-qy0kj4grfn] {
    color: #212529;
    font-weight: 600;
}

/* Management Card Arrow */
.management-card-arrow[b-qy0kj4grfn] {
    font-size: 20px;
    color: #dee2e6;
    transition: all 0.2s ease;
    margin-left: auto;
    flex-shrink: 0;
}

.management-card:hover .management-card-arrow[b-qy0kj4grfn] {
    color: #007bff;
}

.management-card.disabled .management-card-arrow[b-qy0kj4grfn] {
    display: none;
}

/* Coming Soon Badge */
.coming-soon-badge[b-qy0kj4grfn] {
    display: inline-block;
    padding: 4px 10px;
    background: #ffc107;
    color: #856404;
    border-radius: 12px;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-top: 2px;
}

/* Buttons */
.btn[b-qy0kj4grfn] {
    padding: 12px 24px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
}

.btn-primary[b-qy0kj4grfn] {
    background: #007bff !important;
    color: white !important;
}

.btn-primary:hover[b-qy0kj4grfn] {
    background: #0056b3 !important;
}

.btn-filled[b-qy0kj4grfn] {
    background: #007bff !important;
    color: white !important;
}

.btn-filled:hover[b-qy0kj4grfn] {
    background: #0056b3 !important;
}

.btn-icon[b-qy0kj4grfn] {
    font-size: 18px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-container[b-qy0kj4grfn] {
        padding: 16px;
        padding-left: 16px;
        padding-right: 16px;
        margin-left: 0;
        margin-right: 0;
    }

    .page-title[b-qy0kj4grfn] {
        font-size: 1.5rem;
    }

    .page-description[b-qy0kj4grfn] {
        font-size: 0.875rem;
    }

    .management-list[b-qy0kj4grfn] {
        gap: 10px;
        max-width: 100%;
    }

    .management-card[b-qy0kj4grfn] {
        padding: 14px 16px;
        gap: 12px;
    }

    .management-card-icon[b-qy0kj4grfn] {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }

    .icon-emoji[b-qy0kj4grfn] {
        font-size: 20px;
    }

    .management-card-title[b-qy0kj4grfn] {
        font-size: 1rem;
    }

    .management-card-description[b-qy0kj4grfn] {
        font-size: 0.75rem;
    }

    .management-card-arrow[b-qy0kj4grfn] {
        font-size: 18px;
    }

    .access-denied-card[b-qy0kj4grfn] {
        padding: 32px 24px;
    }
}

@media (max-width: 576px) {
    .page-container[b-qy0kj4grfn] {
        padding: 12px;
        padding-left: 12px;
        padding-right: 12px;
        margin-left: 0;
        margin-right: 0;
    }

    .page-title[b-qy0kj4grfn] {
        font-size: 1.375rem;
    }

    .page-description[b-qy0kj4grfn] {
        font-size: 0.813rem;
    }

    .management-list[b-qy0kj4grfn] {
        gap: 8px;
    }

    .management-card[b-qy0kj4grfn] {
        padding: 12px 14px;
        gap: 10px;
    }

    .management-card-icon[b-qy0kj4grfn] {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }

    .icon-emoji[b-qy0kj4grfn] {
        font-size: 18px;
    }

    .management-card-title[b-qy0kj4grfn] {
        font-size: 0.938rem;
    }

    .management-card-description[b-qy0kj4grfn] {
        font-size: 0.688rem;
        line-height: 1.3;
    }

    .management-card-meta[b-qy0kj4grfn] {
        gap: 12px;
    }

    .meta-item[b-qy0kj4grfn] {
        font-size: 0.688rem;
    }

    .management-card-arrow[b-qy0kj4grfn] {
        font-size: 16px;
    }

    .access-denied-card[b-qy0kj4grfn] {
        padding: 24px 20px;
    }

    .access-denied-title[b-qy0kj4grfn] {
        font-size: 1.25rem;
    }

    .access-denied-message[b-qy0kj4grfn] {
        font-size: 0.875rem;
    }
}

@media (max-width: 400px) {
    .page-container[b-qy0kj4grfn] {
        padding: 10px;
    }

    .page-title[b-qy0kj4grfn] {
        font-size: 1.25rem;
    }

    .management-card[b-qy0kj4grfn] {
        padding: 10px 12px;
        gap: 8px;
    }

    .management-card-icon[b-qy0kj4grfn] {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }

    .icon-emoji[b-qy0kj4grfn] {
        font-size: 16px;
    }

    .management-card-title[b-qy0kj4grfn] {
        font-size: 0.875rem;
    }

    .management-card-description[b-qy0kj4grfn] {
        font-size: 0.625rem;
    }

    .management-card-arrow[b-qy0kj4grfn] {
        font-size: 14px;
    }

    .access-denied-card[b-qy0kj4grfn] {
        padding: 20px 16px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Management/PermissionSettings.razor.rz.scp.css */
/* PermissionSettings.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-d9g122qjtw] {
    padding: 24px;
    max-width: 1000px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

/* Page Header */
.page-header[b-d9g122qjtw] {
    margin-bottom: 24px;
}

.page-title[b-d9g122qjtw] {
    font-size: 2.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.page-description[b-d9g122qjtw] {
    font-size: 1.125rem;
    color: #6c757d;
    margin: 0;
}

/* Access Denied */
.access-denied[b-d9g122qjtw] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
}

.access-denied-card[b-d9g122qjtw] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    padding: 48px;
    text-align: center;
    max-width: 400px;
    width: 100%;
}

.access-denied-icon[b-d9g122qjtw] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 24px;
}

.access-denied-title[b-d9g122qjtw] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

.access-denied-message[b-d9g122qjtw] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0 0 32px 0;
    line-height: 1.5;
}

/* Info Banner */
.info-banner[b-d9g122qjtw] {
    background: linear-gradient(135deg, #e7f1ff 0%, #d0e7ff 100%);
    border-left: 4px solid #007bff;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.info-icon[b-d9g122qjtw] {
    font-size: 24px;
    flex-shrink: 0;
    display: none;
}

.info-content[b-d9g122qjtw] {
    flex: 1;
}

.info-title[b-d9g122qjtw] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.info-text[b-d9g122qjtw] {
    font-size: 0.8125rem;
    color: #495057;
    margin: 0;
    line-height: 1.5;
}

/* Toolbar */
.toolbar[b-d9g122qjtw] {
    display: flex;
    gap: 16px;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    max-width: 100%;
}

/* Search Container */
.search-container[b-d9g122qjtw] {
    position: relative;
    max-width: 350px;
    min-width: 250px;
}

.search-input[b-d9g122qjtw] {
    width: 100%;
    padding: 14px 48px 14px 20px;
    font-size: 1rem;
    border: 2px solid #dee2e6;
    border-radius: 10px;
    background: white;
    transition: all 0.2s ease;
}

.search-input:focus[b-d9g122qjtw] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.1);
}

.search-clear[b-d9g122qjtw] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: #dc3545;
    color: white;
    border: none;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    transition: all 0.2s ease;
}

.search-clear:hover[b-d9g122qjtw] {
    background: #c82333;
    transform: translateY(-50%) scale(1.1);
}

/* Role Tabs */
.role-tabs[b-d9g122qjtw] {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    padding: 8px;
    background: #f8f9fa;
    border-radius: 8px;
    align-items: center;
    max-width: 100%;
}

.role-tab[b-d9g122qjtw] {
    flex: 1 1 auto;
    min-width: 180px;
    padding: 14px 24px;
    background: white;
    border: 2px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: left;
    font-weight: 500;
}

.role-tab:hover[b-d9g122qjtw] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.role-tab.regular[b-d9g122qjtw] {
    border-left: 4px solid #6c757d;
}

.role-tab.admin[b-d9g122qjtw] {
    border-left: 4px solid #17a2b8;
}

.role-tab.super[b-d9g122qjtw] {
    border-left: 4px solid #ffc107;
}

.role-tab.regular.active[b-d9g122qjtw] {
    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%);
    color: white;
    box-shadow: 0 4px 16px rgba(108, 117, 125, 0.3);
}

.role-tab.admin.active[b-d9g122qjtw] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: white;
    box-shadow: 0 4px 16px rgba(23, 162, 184, 0.3);
}

.role-tab.super.active[b-d9g122qjtw] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: white;
    box-shadow: 0 4px 16px rgba(255, 193, 7, 0.3);
}

.role-tab-content[b-d9g122qjtw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.role-tab-name[b-d9g122qjtw] {
    font-size: 1rem;
    font-weight: 600;
}

.role-tab-badge[b-d9g122qjtw] {
    padding: 4px 10px;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
}

.role-tab.active .role-tab-badge[b-d9g122qjtw] {
    background: rgba(255, 255, 255, 0.25);
}

/* Empty State */
.empty-state[b-d9g122qjtw] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.empty-icon[b-d9g122qjtw] {
    font-size: 4rem;
    margin-bottom: 16px;
    opacity: 0.5;
}

.empty-state h3[b-d9g122qjtw] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.empty-state p[b-d9g122qjtw] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0;
}

/* Permissions Content */
.permissions-content[b-d9g122qjtw] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
    max-width: 100%;
}

/* Category Section */
.category-section[b-d9g122qjtw] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: all 0.3s ease;
    width: 100%;
}

.category-section:hover[b-d9g122qjtw] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.category-section.expanded .category-section-header[b-d9g122qjtw] {
    background: linear-gradient(135deg, #e7f3ff 0%, #f8f9fa 100%);
    border-bottom: 2px solid #007bff;
}

.category-section-header[b-d9g122qjtw] {
    width: 100%;
    padding: 12px 16px;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border: none;
    border-bottom: 2px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    box-sizing: border-box;
}

.category-section-header:hover[b-d9g122qjtw] {
    background: linear-gradient(135deg, #e9ecef 0%, #f8f9fa 100%);
}

.category-chevron[b-d9g122qjtw] {
    font-size: 14px;
    color: #007bff;
    font-weight: bold;
    margin-right: 8px;
    transition: transform 0.2s ease;
}

.category-section-info[b-d9g122qjtw] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.category-section-title[b-d9g122qjtw] {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.category-section-badge[b-d9g122qjtw] {
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
}

.category-section-badge.all-enabled[b-d9g122qjtw] {
    background: #d4edda;
    color: #155724;
}

.category-section-badge.partial-enabled[b-d9g122qjtw] {
    background: #fff3cd;
    color: #856404;
}

.category-section-badge.none-enabled[b-d9g122qjtw] {
    background: #f8d7da;
    color: #721c24;
}

.category-section-actions[b-d9g122qjtw] {
    display: flex;
    gap: 6px;
}

.btn-quick-action[b-d9g122qjtw] {
    padding: 6px 12px;
    background: transparent;
    border: 1.5px solid #007bff;
    border-radius: 6px;
    color: #007bff;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.btn-enable-all[b-d9g122qjtw] {
    background: #007bff !important;
    color: white !important;
    border-color: #007bff !important;
}

.btn-enable-all:hover[b-d9g122qjtw] {
    background: #0056b3 !important;
    border-color: #0056b3 !important;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.3);
}

.btn-disable-all[b-d9g122qjtw] {
    background: #dc3545 !important;
    color: white !important;
    border-color: #dc3545 !important;
}

.btn-disable-all:hover[b-d9g122qjtw] {
    background: #c82333 !important;
    border-color: #c82333 !important;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.3);
}

/* Permissions Grid */
.permissions-grid[b-d9g122qjtw] {
    padding: 12px 16px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 10px;
    background: #fafbfc;
    box-sizing: border-box;
    width: 100%;
}

/* Permission Card */
.permission-card[b-d9g122qjtw] {
    background: white;
    border: 1.5px solid #e9ecef;
    border-radius: 6px;
    transition: all 0.2s ease;
    overflow: hidden;
}

.permission-card.enabled[b-d9g122qjtw] {
    border-color: #28a745;
    background: #f8fff9;
    border-width: 1.5px;
}

.permission-card.disabled[b-d9g122qjtw] {
    border-color: #e9ecef;
    opacity: 0.7;
}

.permission-card:hover[b-d9g122qjtw] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.permission-card-label[b-d9g122qjtw] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    padding: 10px 12px;
}

.permission-card-checkbox[b-d9g122qjtw] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #28a745;
    margin-top: 2px;
    flex-shrink: 0;
}

.permission-card-checkbox:disabled[b-d9g122qjtw] {
    cursor: not-allowed;
    opacity: 0.5;
}

.permission-card-content[b-d9g122qjtw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.permission-card-name[b-d9g122qjtw] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
    line-height: 1.3;
}

.permission-card-description[b-d9g122qjtw] {
    font-size: 0.75rem;
    color: #6c757d;
    line-height: 1.4;
}

/* Categories Section */
.categories-section[b-d9g122qjtw] {
    margin-bottom: 48px;
}

.section-title[b-d9g122qjtw] {
    font-size: 1.75rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 24px 0;
}

/* Categories Grid */
.categories-grid[b-d9g122qjtw] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
}

/* Category Card */
.category-card[b-d9g122qjtw] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 24px;
    transition: all 0.2s ease;
}

.category-card:hover[b-d9g122qjtw] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.category-header[b-d9g122qjtw] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.category-icon[b-d9g122qjtw] {
    font-size: 32px;
}

.category-title[b-d9g122qjtw] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.category-description[b-d9g122qjtw] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0 0 16px 0;
    line-height: 1.5;
}

.category-stats[b-d9g122qjtw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 12px;
    border-top: 1px solid #e9ecef;
}

.stat-label[b-d9g122qjtw] {
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-d9g122qjtw] {
    font-size: 1rem;
    color: #212529;
    font-weight: 600;
}

/* Action Bar */
.action-bar[b-d9g122qjtw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    gap: 12px;
    flex-wrap: wrap;
    max-width: 100%;
}

.action-group[b-d9g122qjtw] {
    display: flex;
    gap: 8px;
}

/* Buttons */
.btn[b-d9g122qjtw] {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 36px;
}

.btn-primary[b-d9g122qjtw] {
    background: #007bff !important;
    color: white !important;
}

.btn-primary:hover[b-d9g122qjtw] {
    background: #0056b3 !important;
}

.btn-secondary[b-d9g122qjtw] {
    background: #6c757d !important;
    color: white !important;
}

.btn-secondary:hover[b-d9g122qjtw] {
    background: #5a6268 !important;
}

.btn-outline[b-d9g122qjtw] {
    background: transparent !important;
    color: #007bff !important;
    border: 2px solid #007bff !important;
}

.btn-outline:hover[b-d9g122qjtw] {
    background: #007bff !important;
    color: white !important;
}

.btn-primary-outline[b-d9g122qjtw] {
    background: transparent !important;
    color: #007bff !important;
    border: 2px solid #007bff !important;
}

.btn-primary-outline:hover[b-d9g122qjtw] {
    background: #007bff !important;
    color: white !important;
}

.btn-primary-outline:disabled[b-d9g122qjtw] {
    opacity: 0.6;
    cursor: not-allowed;
    background: transparent !important;
    color: #007bff !important;
    border-color: #007bff !important;
}

.btn-filled[b-d9g122qjtw] {
    background: #007bff !important;
    color: white !important;
}

.btn-filled:hover[b-d9g122qjtw] {
    background: #0056b3 !important;
}

.btn-icon[b-d9g122qjtw] {
    font-size: 18px;
}

/* Loading Container */
.loading-container[b-d9g122qjtw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
}

.loading-spinner[b-d9g122qjtw] {
    width: 48px;
    height: 48px;
    border: 4px solid #e9ecef;
    border-top-color: #007bff;
    border-radius: 50%;
    animation: spin-b-d9g122qjtw 0.8s linear infinite;
}

.loading-text[b-d9g122qjtw] {
    font-size: 1rem;
    color: #6c757d;
    font-weight: 500;
}

@keyframes spin-b-d9g122qjtw {
    to {
        transform: rotate(360deg);
    }
}

/* Error and Success Banners */
.error-banner[b-d9g122qjtw],
.success-banner[b-d9g122qjtw] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 16px 20px;
    border-radius: 8px;
    border-left: 4px solid;
    margin-bottom: 20px;
}

.error-banner[b-d9g122qjtw] {
    background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    border-color: #dc3545;
}

.success-banner[b-d9g122qjtw] {
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    border-color: #28a745;
}

.error-icon[b-d9g122qjtw],
.success-icon[b-d9g122qjtw] {
    font-size: 20px;
    flex-shrink: 0;
    display: none;
}

.error-content[b-d9g122qjtw],
.success-content[b-d9g122qjtw] {
    flex: 1;
}

.error-content h3[b-d9g122qjtw] {
    font-size: 1rem;
    font-weight: 600;
    color: #721c24;
    margin: 0 0 4px 0;
}

.error-content p[b-d9g122qjtw],
.success-content p[b-d9g122qjtw] {
    font-size: 0.9375rem;
    color: #495057;
    margin: 0;
    line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-container[b-d9g122qjtw] {
        padding: 16px;
    }

    .page-title[b-d9g122qjtw] {
        font-size: 1.75rem;
    }

    .page-description[b-d9g122qjtw] {
        font-size: 1rem;
    }

    .toolbar[b-d9g122qjtw] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .search-container[b-d9g122qjtw] {
        width: 100%;
        max-width: 100%;
    }

    .role-tabs[b-d9g122qjtw] {
        flex-direction: column;
        gap: 8px;
    }

    .role-tab[b-d9g122qjtw] {
        min-width: unset;
        width: 100%;
    }

    .permissions-grid[b-d9g122qjtw] {
        grid-template-columns: 1fr;
        padding: 10px;
    }

    .category-section-header[b-d9g122qjtw] {
        padding: 10px 12px;
    }

    .category-section-info[b-d9g122qjtw] {
        flex-wrap: wrap;
    }

    .category-section-actions[b-d9g122qjtw] {
        width: 100%;
        justify-content: stretch;
    }

    .btn-quick-action[b-d9g122qjtw] {
        flex: 1;
        text-align: center;
        padding: 8px 10px;
        font-size: 0.75rem;
    }

    .action-bar[b-d9g122qjtw] {
        flex-direction: column;
        align-items: stretch;
    }

    .action-group[b-d9g122qjtw] {
        flex-direction: column;
    }

    .info-banner[b-d9g122qjtw] {
        flex-direction: column;
    }

    .search-input[b-d9g122qjtw] {
        font-size: 0.9375rem;
    }

    .category-section-title[b-d9g122qjtw] {
        font-size: 0.9375rem;
    }

    .permission-card-label[b-d9g122qjtw] {
        padding: 8px 10px;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    .permissions-grid[b-d9g122qjtw] {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }

    .categories-grid[b-d9g122qjtw] {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Management/Preferences.razor.rz.scp.css */
/* Preferences Page Styles */

.page-container[b-wu862qbfrs] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* Breadcrumbs */
.breadcrumbs[b-wu862qbfrs] {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.breadcrumb-item[b-wu862qbfrs] {
    color: #007bff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.breadcrumb-item:hover[b-wu862qbfrs] {
    text-decoration: underline;
}

.breadcrumb-item.disabled[b-wu862qbfrs] {
    color: #6c757d;
    cursor: default;
}

.breadcrumb-separator[b-wu862qbfrs] {
    color: #6c757d;
    font-size: 14px;
}

/* Page Header */
.page-header[b-wu862qbfrs] {
    margin-bottom: 24px;
}

.page-header h1[b-wu862qbfrs] {
    margin: 0 0 8px 0;
    font-size: 1.875rem;
    font-weight: 600;
    color: #212529;
}

.page-subtitle[b-wu862qbfrs] {
    margin: 0;
    font-size: 14px;
    color: #6c757d;
}

/* Optional Badge */
.optional-badge[b-wu862qbfrs] {
    display: inline-block;
    padding: 2px 8px;
    background: #e9ecef;
    color: #6c757d;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 4px;
    margin-left: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading State */
.loading-container[b-wu862qbfrs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-wu862qbfrs] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-wu862qbfrs 1s linear infinite;
}

.loading-text[b-wu862qbfrs] {
    margin-top: 16px;
    font-size: 14px;
    color: #6c757d;
}

@keyframes spin-b-wu862qbfrs {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Preferences Card */
.preferences-card[b-wu862qbfrs] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.card-header[b-wu862qbfrs] {
    padding: 24px;
    border-bottom: 1px solid #e9ecef;
}

.card-header h2[b-wu862qbfrs] {
    margin: 0 0 8px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

.card-subtitle[b-wu862qbfrs] {
    margin: 0;
    font-size: 14px;
    color: #6c757d;
}

.card-content[b-wu862qbfrs] {
    padding: 24px;
    display: flex;
    flex-direction: column;
}

.form-label-checkbox[b-wu862qbfrs] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #495057;
    cursor: pointer;
}

.form-checkbox[b-wu862qbfrs] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #007bff;
}

.form-checkbox:disabled[b-wu862qbfrs] {
    cursor: not-allowed;
    opacity: 0.6;
}

/* Form Elements */
.form-field[b-wu862qbfrs] {
    margin-bottom: 24px;
}

.form-label[b-wu862qbfrs] {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #495057;
}

.form-input[b-wu862qbfrs] {
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
}

.form-input:focus[b-wu862qbfrs] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-input-sm[b-wu862qbfrs] {
    margin-top: 8px;
    font-size: 13px;
    padding: 8px 10px;
    font-style: italic;
    color: #6c757d;
}

.form-textarea[b-wu862qbfrs] {
    width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-family: inherit;
    line-height: 1.5;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    resize: vertical;
}

.form-textarea:focus[b-wu862qbfrs] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.field-help[b-wu862qbfrs] {
    margin: 6px 0 0 0;
    font-size: 12px;
    color: #6c757d;
}

/* Requirements Section */
.requirements-section[b-wu862qbfrs] {
    margin: 32px 0;
    padding: 24px;
    background: #f8f9fa;
    border-radius: 8px;
}

.section-header[b-wu862qbfrs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.section-title[b-wu862qbfrs] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #212529;
}

.section-subtitle[b-wu862qbfrs] {
    margin: 0 0 24px 0;
    font-size: 0.9rem;
    color: #6c757d;
}

.btn-small[b-wu862qbfrs] {
    padding: 8px 16px;
    font-size: 0.875rem;
}

/* Checklist Builder */
.checklist-builder[b-wu862qbfrs] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.checklist-builder-item[b-wu862qbfrs] {
    background: white;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.2s ease;
    box-sizing: border-box;
    width: 100%;
}

.checklist-builder-item:hover[b-wu862qbfrs] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.item-header[b-wu862qbfrs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.item-header:hover[b-wu862qbfrs] {
    background: #f1f5f9;
}

.item-header-content[b-wu862qbfrs] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
}

.item-title[b-wu862qbfrs] {
    flex: 1;
    min-width: 0;
}

.item-title-text[b-wu862qbfrs] {
    font-weight: 600;
    color: #212529;
    font-size: 0.95rem;
}

.item-title-placeholder[b-wu862qbfrs] {
    font-style: italic;
    color: #94a3b8;
    font-size: 0.9rem;
}

.item-header-actions[b-wu862qbfrs] {
    display: flex;
    align-items: center;
    gap: 8px;
}


.item-number[b-wu862qbfrs] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--tenant-primary-color);
    color: white;
    font-weight: 700;
    font-size: 0.9rem;
    border-radius: 8px;
}

.item-type-toggle[b-wu862qbfrs] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
}

.toggle-label[b-wu862qbfrs] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
}

/* Toggle Switch */
.toggle-switch[b-wu862qbfrs] {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
}

.toggle-switch input[type="checkbox"][b-wu862qbfrs] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-wu862qbfrs] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #94a3b8;
    transition: 0.3s;
    border-radius: 24px;
}

.toggle-slider[b-wu862qbfrs]:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
}

.toggle-switch input:checked + .toggle-slider[b-wu862qbfrs] {
    background-color: #3b82f6;
}

.toggle-switch input:checked + .toggle-slider[b-wu862qbfrs]:before {
    transform: translateX(20px);
}

.btn-icon[b-wu862qbfrs] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: none;
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-icon svg[b-wu862qbfrs] {
    width: 20px;
    height: 20px;
}

.btn-icon.btn-danger[b-wu862qbfrs] {
    color: #ef4444;
}

.btn-icon.btn-expand[b-wu862qbfrs] {
    color: #64748b;
    transition: transform 0.2s ease, color 0.2s ease;
}

.btn-icon.btn-expand:hover[b-wu862qbfrs] {
    background: #f1f5f9;
    color: #475569;
}

.expand-icon[b-wu862qbfrs] {
    transition: transform 0.2s ease;
    width: 20px;
    height: 20px;
}

.expand-icon.expanded[b-wu862qbfrs] {
    transform: rotate(180deg);
}

/* Required Badge */
.required-badge[b-wu862qbfrs] {
    display: inline-block;
    padding: 2px 8px;
    background: #fee2e2;
    color: #991b1b;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 4px;
    margin-left: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Validation Styles */
.validation-error-input[b-wu862qbfrs] {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1) !important;
}

.validation-error[b-wu862qbfrs] {
    display: block;
    margin-top: 6px;
    font-size: 0.875rem;
    color: #ef4444;
    font-weight: 500;
}

.validation-summary[b-wu862qbfrs] {
    margin-top: 20px;
    padding: 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
}

.validation-summary-title[b-wu862qbfrs] {
    margin: 0 0 12px 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #991b1b;
}

.validation-summary-list[b-wu862qbfrs] {
    margin: 0;
    padding-left: 20px;
    color: #dc2626;
    font-size: 0.875rem;
}

.validation-summary-list li[b-wu862qbfrs] {
    margin-bottom: 6px;
}

.item-content[b-wu862qbfrs] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
    box-sizing: border-box;
    width: 100%;
    overflow: hidden;
    min-width: 0;
    background: white;
    border-top: 1px solid #e2e8f0;
    animation: slideDown-b-wu862qbfrs 0.2s ease-out;
}

@keyframes slideDown-b-wu862qbfrs {
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 500px;
    }
}

/* Empty State */
.empty-state[b-wu862qbfrs] {
    text-align: center;
    padding: 48px 24px;
    color: #94a3b8;
}

.empty-state p[b-wu862qbfrs] {
    margin: 0;
    font-size: 0.95rem;
}

.requirement-group[b-wu862qbfrs] {
    margin-bottom: 20px;
    padding: 16px;
    background: white;
    border-radius: 6px;
    border-left: 4px solid #10b981;
}

.requirement-group:last-child[b-wu862qbfrs] {
    margin-bottom: 0;
}

.requirement-group .form-label[b-wu862qbfrs] {
    margin-bottom: 8px;
}

/* Form Actions */
.form-actions[b-wu862qbfrs] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 24px;
    margin-top: 24px;
    border-top: 1px solid #e9ecef;
}

/* Reset Button - Same styling as MainOutlinedButton but with orange color */
.btn-reset[b-wu862qbfrs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-decoration: none;
    white-space: nowrap;
    min-height: 40px;
    background-color: transparent;
    color: #f59e0b;
    border: 1px solid #f59e0b;
    box-shadow: none;
}

.btn-reset:hover:not(:disabled)[b-wu862qbfrs] {
    background-color: #f59e0b;
    color: white;
}

.btn-reset:focus[b-wu862qbfrs] {
    outline: 2px solid #f59e0b;
    outline-offset: 2px;
}

.btn-reset:disabled[b-wu862qbfrs] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .preferences-card[b-wu862qbfrs] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .page-container[b-wu862qbfrs] {
        padding: 16px;
    }

    .page-header h1[b-wu862qbfrs] {
        font-size: 1.5rem;
    }

    .card-header[b-wu862qbfrs] {
        padding: 20px;
    }

    .card-content[b-wu862qbfrs] {
        padding: 20px;
    }

    .requirements-section[b-wu862qbfrs] {
        padding: 16px;
        margin: 24px 0;
    }

    .requirement-group[b-wu862qbfrs] {
        padding: 12px;
    }

    .form-actions[b-wu862qbfrs] {
        flex-direction: column;
    }

    .btn-reset[b-wu862qbfrs] {
        width: 100%;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Management/TeamManage.razor.rz.scp.css */
/* Settings.razor.css - Blazor CSS Isolation */

/* Page Container */
.page-container[b-bw4kz9mojk] {
    padding: 24px;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

/* Page Header */
.page-header[b-bw4kz9mojk] {
    margin-bottom: 24px;
}

.page-title[b-bw4kz9mojk] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

/* Action Bar */
.action-bar[b-bw4kz9mojk] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
}

.search-controls[b-bw4kz9mojk] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    align-items: stretch;
}

.search-field[b-bw4kz9mojk] {
    width: 100%;
    min-width: 0;
}

.action-controls[b-bw4kz9mojk] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    align-items: stretch;
}

.filter-controls[b-bw4kz9mojk] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    position: relative;
    z-index: 1;
}

.filter-controls .form-select[b-bw4kz9mojk] {
    min-width: 180px;
    width: 100%;
}

/* Form Elements */
.form-input[b-bw4kz9mojk] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 40px;
}

.form-input:focus[b-bw4kz9mojk] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-bw4kz9mojk] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-bw4kz9mojk]::placeholder {
    color: #6b7280;
    opacity: 1;
}

.form-select[b-bw4kz9mojk] {
    width: 100%;
    padding: 12px 16px;
    padding-right: 40px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 40px;
    cursor: pointer;
    position: relative;
    z-index: 1;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 12px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}

.form-select:focus[b-bw4kz9mojk] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
    z-index: 10;
}

.form-select:active[b-bw4kz9mojk] {
    z-index: 10;
}

.form-select:hover:not(:focus)[b-bw4kz9mojk] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

/* Data Table */
.data-table[b-bw4kz9mojk] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
    table-layout: fixed;
}

.data-table th[b-bw4kz9mojk] {
    text-align: left;
    padding: 12px 16px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #e9ecef;
    border-right: 1px solid #e9ecef;
    background: #f8f9fa;
}

.data-table th:first-child[b-bw4kz9mojk] {
    width: 30%;
}

.data-table th:nth-child(2)[b-bw4kz9mojk] {
    width: 25%;
}

.data-table th:nth-child(3)[b-bw4kz9mojk] {
    width: 15%;
}

.data-table th:nth-child(4)[b-bw4kz9mojk] {
    width: 15%;
}

.data-table th:nth-child(5)[b-bw4kz9mojk] {
    width: 15%;
}

.data-table th:last-child[b-bw4kz9mojk] {
    border-right: none;
}

.data-table td[b-bw4kz9mojk] {
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
    border-right: 1px solid #e9ecef;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
}

.data-table td:nth-child(2)[b-bw4kz9mojk] {
    word-break: break-word;
}

.data-table td:last-child[b-bw4kz9mojk] {
    border-right: none;
}

.data-table tr:hover[b-bw4kz9mojk] {
    background: #f8f9fa;
}

.text-center[b-bw4kz9mojk] {
    text-align: center;
}

.hide-mobile[b-bw4kz9mojk] {
    display: table-cell;
}

.hide-tablet[b-bw4kz9mojk] {
    display: table-cell;
}

/* Employee Name Cell */
.employee-name-cell[b-bw4kz9mojk] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.employee-avatar[b-bw4kz9mojk] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #007bff;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    flex-shrink: 0;
}

.employee-info[b-bw4kz9mojk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.employee-name[b-bw4kz9mojk] {
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.employee-phone[b-bw4kz9mojk] {
    font-size: 0.75rem;
    color: #6c757d;
    margin: 0;
}

.employee-mobile-info[b-bw4kz9mojk] {
    display: none;
    flex-direction: column;
    gap: 4px;
    margin-top: 4px;
}

.employee-mobile-email[b-bw4kz9mojk] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Status Badges */
.status-badge[b-bw4kz9mojk] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    display: inline-block;
}

.status-badge.regular[b-bw4kz9mojk] {
    background: #e9ecef;
    color: #495057;
}

.status-badge.admin[b-bw4kz9mojk] {
    background: #d1ecf1;
    color: #0c5460;
}

.status-badge.super[b-bw4kz9mojk] {
    background: #fff3cd;
    color: #856404;
}

.status-badge.owner[b-bw4kz9mojk] {
    background: #d4edda;
    color: #155724;
}

.status-badge.active[b-bw4kz9mojk] {
    background: #d4edda;
    color: #155724;
}

.status-badge.inactive[b-bw4kz9mojk] {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.verified[b-bw4kz9mojk] {
    background: #d4edda;
    color: #155724;
}

.status-badge.unverified[b-bw4kz9mojk] {
    background: #fff3cd;
    color: #856404;
}

/* Action Dropdown */
.action-dropdown[b-bw4kz9mojk] {
    position: relative;
    display: inline-block;
}

.action-select[b-bw4kz9mojk] {
    appearance: none;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 6px 24px 6px 8px;
    font-size: 12px;
    color: #495057;
    cursor: pointer;
    min-width: 120px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 6px center;
    background-repeat: no-repeat;
    background-size: 12px 12px;
}

.action-select:focus[b-bw4kz9mojk] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

/* Mobile Card View */
.mobile-card-view[b-bw4kz9mojk] {
    display: none;
}

.employee-card[b-bw4kz9mojk] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.employee-card-header[b-bw4kz9mojk] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.employee-card-title[b-bw4kz9mojk] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

.employee-card-email[b-bw4kz9mojk] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

.employee-card-info[b-bw4kz9mojk] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.employee-card-info-item[b-bw4kz9mojk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.employee-card-info-label[b-bw4kz9mojk] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    font-weight: 600;
}

.employee-card-info-value[b-bw4kz9mojk] {
    font-size: 0.875rem;
    color: #212529;
    font-weight: 500;
}

.employee-card-actions[b-bw4kz9mojk] {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 12px;
}

.employee-card-actions .action-buttons[b-bw4kz9mojk] {
    display: flex;
    gap: 12px;
    width: 100%;
}

.employee-card-actions .action-btn[b-bw4kz9mojk] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px 14px !important;
    min-height: 40px !important;
    font-size: 14px !important;
    background: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
    flex: 1 !important;
}

.employee-card-actions .action-btn svg[b-bw4kz9mojk] {
    width: 18px !important;
    height: 18px !important;
}

.employee-card-actions .action-btn-text[b-bw4kz9mojk] {
    display: inline !important;
    font-weight: 500 !important;
}

/* Hover effects for action buttons */
.employee-card-actions .action-btn.view-btn:hover[b-bw4kz9mojk] {
    background: #007bff !important;
    color: white !important;
    border-color: #007bff !important;
}

.employee-card-actions .action-btn.edit-btn:hover[b-bw4kz9mojk] {
    background: #28a745 !important;
    color: white !important;
    border-color: #28a745 !important;
}

.employee-card-actions .action-btn.delete-btn:hover[b-bw4kz9mojk] {
    background: #dc3545 !important;
    color: white !important;
    border-color: #dc3545 !important;
}

/* Buttons */
.btn[b-bw4kz9mojk] {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 36px;
}

.btn-sm[b-bw4kz9mojk] {
    padding: 6px 12px;
    font-size: 12px;
    min-height: 32px;
}

.btn-primary[b-bw4kz9mojk] {
    background: #007bff;
    color: white;
}

.btn-primary:hover[b-bw4kz9mojk] {
    background: #0056b3;
}

.btn-outline[b-bw4kz9mojk] {
    background: transparent;
    color: #007bff;
    border: 1px solid #007bff;
}

.btn-outline:hover[b-bw4kz9mojk] {
    background: #007bff;
    color: white;
}

.btn-secondary[b-bw4kz9mojk] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover[b-bw4kz9mojk] {
    background: #5a6268;
}

.btn-danger[b-bw4kz9mojk] {
    background: #dc3545;
    color: white;
}

.btn-danger:hover[b-bw4kz9mojk] {
    background: #c82333;
}

/* Pagination */
.pagination-container[b-bw4kz9mojk] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}

.pagination-info[b-bw4kz9mojk] {
    font-size: 0.875rem;
    color: #6c757d;
    text-align: center;
}

.pagination-controls[b-bw4kz9mojk] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pagination-btn[b-bw4kz9mojk] {
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    background: white;
    color: #495057;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s ease;
}

.pagination-btn:hover:not(:disabled)[b-bw4kz9mojk] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.pagination-btn:disabled[b-bw4kz9mojk] {
    opacity: 0.5;
    cursor: not-allowed;
}

.pagination-btn.active[b-bw4kz9mojk] {
    background: #007bff;
    color: white;
    border-color: #007bff;
}

/* Loading and Empty States */
.loading-container[b-bw4kz9mojk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-bw4kz9mojk] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-bw4kz9mojk 1s linear infinite;
}

.loading-text[b-bw4kz9mojk] {
    margin-top: 16px;
    font-size: 1.125rem;
    color: #6c757d;
}

.empty-state[b-bw4kz9mojk] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
}

.empty-state-icon[b-bw4kz9mojk] {
    font-size: 4rem;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-state-title[b-bw4kz9mojk] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #495057;
}

.empty-state-message[b-bw4kz9mojk] {
    font-size: 14px;
    margin: 0;
    color: #6c757d;
}

@keyframes spin-b-bw4kz9mojk {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (min-width: 768px) {
    .page-container[b-bw4kz9mojk] {
        padding: 32px;
    }

    .page-title[b-bw4kz9mojk] {
        font-size: 2.5rem;
    }

    .action-bar[b-bw4kz9mojk] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
    }

    .search-controls[b-bw4kz9mojk] {
        flex-direction: row;
        width: auto;
        gap: 16px;
        align-items: center;
        flex: 1;
        max-width: 400px;
    }

    .action-controls[b-bw4kz9mojk] {
        width: auto;
        flex-shrink: 0;
        align-items: center;
        flex-direction: row;
        gap: 16px;
    }

    .filter-controls[b-bw4kz9mojk] {
        flex-direction: row;
        width: auto;
        gap: 16px;
        align-items: center;
    }

    .filter-controls .form-select[b-bw4kz9mojk] {
        min-width: 200px;
        width: auto;
    }

    .pagination-container[b-bw4kz9mojk] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .pagination-info[b-bw4kz9mojk] {
        text-align: left;
    }

    .hide-mobile[b-bw4kz9mojk] {
        display: table-cell;
    }
}

@media (max-width: 767px) {
    .page-container[b-bw4kz9mojk] {
        padding: 16px;
        margin: 0 auto;
    }

    .page-title[b-bw4kz9mojk] {
        font-size: 1.5rem;
    }

    .hide-mobile[b-bw4kz9mojk] {
        display: none;
    }

    .mobile-card-view[b-bw4kz9mojk] {
        display: block;
    }

    .desktop-grid[b-bw4kz9mojk] {
        display: none;
    }

    .employee-mobile-info[b-bw4kz9mojk] {
        display: flex;
    }

    .action-select[b-bw4kz9mojk] {
        min-width: 80px;
        font-size: 11px;
        padding: 4px 20px 4px 6px;
    }

    .mobile-only[b-bw4kz9mojk] {
        display: inline;
    }

    .desktop-only[b-bw4kz9mojk] {
        display: none;
    }
}

@media (max-width: 1199px) {
    .hide-tablet[b-bw4kz9mojk] {
        display: none;
    }
}

@media (min-width: 480px) {
    .mobile-card-view[b-bw4kz9mojk] {
        display: none;
    }

    .desktop-grid[b-bw4kz9mojk] {
        display: block;
    }
}

/* Additional Utility Classes */
.mobile-only[b-bw4kz9mojk] {
    display: none;
}

.desktop-only[b-bw4kz9mojk] {
    display: inline;
}

/* Actions Header */
.actions-header[b-bw4kz9mojk] {
    white-space: nowrap;
}

.actions-text-mobile[b-bw4kz9mojk] {
    display: none;
}

.actions-text-full[b-bw4kz9mojk] {
    display: inline;
}

/* Action buttons styles imported from ActionButtons.razor.css */

/* Mobile Responsive */
@media (max-width: 768px) {
    /* Adjust search field on tablets */
    .form-input.search-field[b-bw4kz9mojk] {
        padding: 10px 14px;
        font-size: 16px;
    }

    .page-container[b-bw4kz9mojk] {
        padding: 16px;
    }

    .action-bar[b-bw4kz9mojk] {
        padding: 12px;
    }
}

@media (max-width: 576px) {
    /* Show abbreviated actions header on mobile */
    .actions-text-full[b-bw4kz9mojk] {
        display: none;
    }

    .actions-text-mobile[b-bw4kz9mojk] {
        display: inline;
        font-size: 18px;
        letter-spacing: 2px;
    }

    /* Tighter action button spacing on mobile */
    .action-buttons[b-bw4kz9mojk] {
        gap: 8px !important;
    }

    .action-btn[b-bw4kz9mojk] {
        min-width: 32px !important;
        min-height: 32px !important;
        padding: 6px !important;
    }

    /* Smaller search field on mobile */
    .form-input.search-field[b-bw4kz9mojk] {
        padding: 8px 12px;
        font-size: 14px;
    }

    .page-container[b-bw4kz9mojk] {
        padding: 12px;
        margin: 0 auto;
    }

    .action-bar[b-bw4kz9mojk] {
        padding: 10px;
    }

    .page-title[b-bw4kz9mojk] {
        font-size: 1.5rem;
    }

    /* Mobile card action button adjustments */
    .employee-card-actions .action-btn[b-bw4kz9mojk] {
        padding: 8px 10px !important;
        min-height: 38px !important;
        font-size: 13px !important;
        gap: 4px !important;
    }

    .employee-card-actions .action-btn svg[b-bw4kz9mojk] {
        width: 16px !important;
        height: 16px !important;
    }
}

@media (max-width: 400px) {
    /* Stack card action buttons vertically on very small screens */
    .employee-card-actions .action-buttons[b-bw4kz9mojk] {
        flex-direction: column;
        gap: 8px;
    }

    .employee-card-actions .action-btn[b-bw4kz9mojk] {
        width: 100% !important;
        padding: 10px 12px !important;
        justify-content: flex-start !important;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Management/ThemeSettings.razor.rz.scp.css */
/* Theme Settings Page - Complete Redesign */

/* ============================================
   BASE LAYOUT
   ============================================ */

.access-denied[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80vh;
    padding: 2rem;
}

.access-denied-card[b-dz7ziknkyg] {
    text-align: center;
    max-width: 400px;
    padding: 3rem 2rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.access-denied-icon[b-dz7ziknkyg]::before {
    content: "🔒";
    font-size: 4rem;
    display: block;
    margin-bottom: 1.5rem;
}

.access-denied-title[b-dz7ziknkyg] {
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    color: #1f2937;
}

.access-denied-message[b-dz7ziknkyg] {
    color: #6b7280;
    margin-bottom: 2rem;
}

.page-container[b-dz7ziknkyg] {
    max-width: 1600px;
    margin: 0 auto;
    padding: 2rem;
}

.page-header[b-dz7ziknkyg] {
    margin-bottom: 2rem;
}

.page-title[b-dz7ziknkyg] {
    font-size: 2rem;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 0.5rem;
}

.page-description[b-dz7ziknkyg] {
    color: #6b7280;
    font-size: 1rem;
}

/* ============================================
   ALERTS
   ============================================ */

.alert[b-dz7ziknkyg] {
    padding: 1rem 1.25rem;
    border-radius: 8px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    animation: slideIn-b-dz7ziknkyg 0.3s ease;
}

.alert-success[b-dz7ziknkyg] {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #6ee7b7;
}

.alert-error[b-dz7ziknkyg] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.alert-icon[b-dz7ziknkyg] {
    font-size: 1.25rem;
    font-weight: bold;
}

/* ============================================
   LOADING STATE
   ============================================ */

.loading-container[b-dz7ziknkyg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
}

.loading-spinner[b-dz7ziknkyg] {
    width: 40px;
    height: 40px;
    border: 4px solid #e5e7eb;
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin-b-dz7ziknkyg 0.8s linear infinite;
}

/* ============================================
   MAIN LAYOUT - TWO COLUMN
   ============================================ */

.theme-layout[b-dz7ziknkyg] {
    display: grid;
    grid-template-columns: 1fr 480px;
    gap: 2rem;
    align-items: start;
}

/* Left Column: Controls */
.theme-controls[b-dz7ziknkyg] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Right Column: Preview (Sticky) */
.theme-preview[b-dz7ziknkyg] {
    position: relative;
}

.preview-sticky[b-dz7ziknkyg] {
    position: sticky;
    top: 2rem;
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.preview-header[b-dz7ziknkyg] {
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
}

.preview-header h3[b-dz7ziknkyg] {
    font-size: 1.125rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 0.25rem 0;
}

.preview-header p[b-dz7ziknkyg] {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0;
}

/* ============================================
   TABS
   ============================================ */

.settings-tabs[b-dz7ziknkyg] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    background: white;
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.tab-btn[b-dz7ziknkyg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 1.25rem 1rem;
    border: 2px solid #e5e7eb;
    background: white;
    color: #6b7280;
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s;
}

.tab-btn:hover[b-dz7ziknkyg] {
    background: #f9fafb;
    border-color: #d1d5db;
    color: #374151;
}

.tab-btn.active[b-dz7ziknkyg] {
    background: #3b82f6;
    border-color: #3b82f6;
    color: white;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.tab-btn svg[b-dz7ziknkyg] {
    flex-shrink: 0;
}

/* ============================================
   TAB CONTENT
   ============================================ */

.tab-content[b-dz7ziknkyg] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* ============================================
   COLOR CARDS
   ============================================ */

.settings-grid-modern[b-dz7ziknkyg] {
    display: grid;
    gap: 1.5rem;
}

.color-card[b-dz7ziknkyg] {
    background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%);
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    transition: all 0.2s;
}

.color-card:hover[b-dz7ziknkyg] {
    border-color: #3b82f6;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.1);
}

.color-card-header[b-dz7ziknkyg] {
    margin-bottom: 1rem;
}

.color-card-header h4[b-dz7ziknkyg] {
    font-size: 1rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 0.25rem 0;
}

.color-card-header p[b-dz7ziknkyg] {
    font-size: 0.8125rem;
    color: #6b7280;
    margin: 0;
}

.color-controls[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.color-picker-modern[b-dz7ziknkyg] {
    width: 48px;
    height: 48px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
}

.color-picker-modern:hover[b-dz7ziknkyg] {
    border-color: #3b82f6;
}

.color-input[b-dz7ziknkyg] {
    flex: 1;
    padding: 0.75rem 1rem;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 0.875rem;
    font-family: 'SF Mono', 'Monaco', 'Courier New', monospace;
    font-weight: 500;
    transition: all 0.2s;
}

.color-input:focus[b-dz7ziknkyg] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.btn-icon[b-dz7ziknkyg] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #e5e7eb;
    background: white;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    color: #6b7280;
}

.btn-icon:hover[b-dz7ziknkyg] {
    background: #3b82f6;
    border-color: #3b82f6;
    color: white;
}

/* ============================================
   TOGGLE CARDS
   ============================================ */

.toggle-card[b-dz7ziknkyg] {
    background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%);
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    transition: all 0.2s;
}

.toggle-card.full-width[b-dz7ziknkyg] {
    grid-column: 1 / -1;
}

.toggle-card:hover[b-dz7ziknkyg] {
    border-color: #d1d5db;
}

.toggle-card-content[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.toggle-card-content h4[b-dz7ziknkyg] {
    font-size: 1rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 0.25rem 0;
}

.toggle-card-content p[b-dz7ziknkyg] {
    font-size: 0.8125rem;
    color: #6b7280;
    margin: 0;
}

.toggle-card-expanded[b-dz7ziknkyg] {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px solid #e5e7eb;
}

/* Toggle Switch */
.toggle-switch-modern[b-dz7ziknkyg] {
    position: relative;
    display: inline-block;
    width: 52px;
    height: 28px;
    flex-shrink: 0;
}

.toggle-switch-modern input[b-dz7ziknkyg] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider-modern[b-dz7ziknkyg] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d1d5db;
    transition: 0.3s;
    border-radius: 28px;
}

.toggle-slider-modern[b-dz7ziknkyg]:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.toggle-switch-modern input:checked + .toggle-slider-modern[b-dz7ziknkyg] {
    background-color: #3b82f6;
}

.toggle-switch-modern input:checked + .toggle-slider-modern[b-dz7ziknkyg]:before {
    transform: translateX(24px);
}

/* ============================================
   GRADIENT CONTROLS
   ============================================ */

.gradient-section[b-dz7ziknkyg] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.direction-selector[b-dz7ziknkyg] {
    background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%);
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
}

.direction-selector h4[b-dz7ziknkyg] {
    font-size: 1rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 1rem 0;
    text-align: center;
}

.direction-grid[b-dz7ziknkyg] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    max-width: 280px;
    margin: 0 auto;
}

.direction-btn[b-dz7ziknkyg] {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #e5e7eb;
    background: white;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    color: #6b7280;
}

.direction-btn:hover[b-dz7ziknkyg] {
    background: #f3f4f6;
    border-color: #d1d5db;
}

.direction-btn.active[b-dz7ziknkyg] {
    background: #3b82f6;
    border-color: #3b82f6;
    color: white;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.direction-center[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.gradient-mini[b-dz7ziknkyg] {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    border: 2px solid #e5e7eb;
}

/* ============================================
   BRANDING SECTION
   ============================================ */

.branding-section[b-dz7ziknkyg] {
    display: grid;
    gap: 1.5rem;
}

.branding-card[b-dz7ziknkyg] {
    background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%);
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
}

.branding-header[b-dz7ziknkyg] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.branding-header svg[b-dz7ziknkyg] {
    color: #3b82f6;
    flex-shrink: 0;
}

.branding-header h4[b-dz7ziknkyg] {
    font-size: 1rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 0.25rem 0;
}

.branding-header p[b-dz7ziknkyg] {
    font-size: 0.8125rem;
    color: #6b7280;
    margin: 0;
}

.branding-upload[b-dz7ziknkyg] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.upload-zone[b-dz7ziknkyg] {
    border: 2px dashed #d1d5db;
    border-radius: 12px;
    padding: 3rem 2rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s;
    background: white;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}

.upload-zone:hover[b-dz7ziknkyg] {
    border-color: #3b82f6;
    background: #f0f9ff;
}

.upload-zone svg[b-dz7ziknkyg] {
    color: #9ca3af;
}

.upload-zone-text[b-dz7ziknkyg] {
    font-size: 0.875rem;
    color: #374151;
}

.upload-zone-text strong[b-dz7ziknkyg] {
    color: #3b82f6;
    font-weight: 700;
}

.upload-zone-hint[b-dz7ziknkyg] {
    font-size: 0.75rem;
    color: #9ca3af;
}

.file-input-hidden[b-dz7ziknkyg] {
    display: none;
}

.image-preview-modern[b-dz7ziknkyg] {
    position: relative;
    width: fit-content;
    max-width: 100%;
}

.image-preview-modern img[b-dz7ziknkyg] {
    max-width: 300px;
    max-height: 200px;
    border-radius: 8px;
    display: block;
    border: 2px solid #e5e7eb;
}

.image-preview-modern.favicon img[b-dz7ziknkyg] {
    max-width: 64px;
    max-height: 64px;
}

.btn-remove-modern[b-dz7ziknkyg] {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 32px;
    height: 32px;
    background: #ef4444;
    color: white;
    border: 3px solid white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.btn-remove-modern:hover[b-dz7ziknkyg] {
    background: #dc2626;
    transform: scale(1.1);
}

.file-info[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 0.875rem;
    color: #374151;
}

.file-info svg[b-dz7ziknkyg] {
    color: #9ca3af;
}

.btn-upload-modern[b-dz7ziknkyg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background: white;
    color: #3b82f6;
    border: 2px solid #3b82f6;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.875rem;
}

.btn-upload-modern:hover[b-dz7ziknkyg] {
    background: #3b82f6;
    color: white;
}

/* ============================================
   ACTION BAR
   ============================================ */

.action-bar[b-dz7ziknkyg] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.btn-action[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 1rem 2rem;
    border: none;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.9375rem;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-action.secondary[b-dz7ziknkyg] {
    background: white;
    color: #6b7280;
    border: 2px solid #e5e7eb;
}

.btn-action.secondary:hover:not(:disabled)[b-dz7ziknkyg] {
    background: #f3f4f6;
    border-color: #9ca3af;
    color: #374151;
}

.btn-action.primary[b-dz7ziknkyg] {
    background: #3b82f6;
    color: white;
    border: 2px solid #3b82f6;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.btn-action.primary:hover:not(:disabled)[b-dz7ziknkyg] {
    background: #2563eb;
    border-color: #2563eb;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4);
}

.btn-action:disabled[b-dz7ziknkyg] {
    opacity: 0.6;
    cursor: not-allowed;
}

.spinner-modern[b-dz7ziknkyg] {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-dz7ziknkyg 0.6s linear infinite;
}

/* ============================================
   LIVE PREVIEW MOCKUP
   ============================================ */

.preview-window[b-dz7ziknkyg] {
    background: #f9fafb;
    border-radius: 8px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 200px 1fr;
    height: 500px;
    border: 1px solid #e5e7eb;
}

.mock-sidebar[b-dz7ziknkyg] {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.mock-logo[b-dz7ziknkyg] {
    padding: 1.25rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.mock-logo-title[b-dz7ziknkyg] {
    font-weight: 700;
    font-size: 0.9375rem;
    margin: 0;
}

.mock-logo-subtitle[b-dz7ziknkyg] {
    font-size: 0.6875rem;
    opacity: 0.8;
    margin: 0;
}

.mock-menu[b-dz7ziknkyg] {
    padding: 1rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.mock-menu-item[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.875rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 500;
    transition: all 0.2s;
    cursor: pointer;
}

.mock-menu-item:hover[b-dz7ziknkyg] {
    background: rgba(255, 255, 255, 0.1);
}

.mock-menu-item.active[b-dz7ziknkyg] {
    background: rgba(255, 255, 255, 0.15);
    font-weight: 600;
    border-left: 3px solid rgba(255, 255, 255, 0.6);
}

.mock-menu-item svg[b-dz7ziknkyg] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.mock-content[b-dz7ziknkyg] {
    padding: 1.5rem;
    overflow-y: auto;
}

.mock-card[b-dz7ziknkyg] {
    background: white;
    border-radius: 8px;
    padding: 1.5rem;
    border: 1px solid #e5e7eb;
}

.mock-card-header h4[b-dz7ziknkyg] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 1rem 0;
}

.color-swatches[b-dz7ziknkyg] {
    display: grid;
    gap: 0.75rem;
}

.swatch-item[b-dz7ziknkyg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: #f9fafb;
    border-radius: 6px;
}

.swatch[b-dz7ziknkyg] {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    flex-shrink: 0;
}

.swatch-info[b-dz7ziknkyg] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.swatch-label[b-dz7ziknkyg] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
}

.swatch-info code[b-dz7ziknkyg] {
    font-size: 0.6875rem;
    color: #6b7280;
    font-family: 'SF Mono', 'Monaco', 'Courier New', monospace;
}

/* ============================================
   BUTTONS
   ============================================ */

.btn[b-dz7ziknkyg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.btn-primary[b-dz7ziknkyg] {
    background: #3b82f6;
    color: white;
}

.btn-primary:hover[b-dz7ziknkyg] {
    background: #2563eb;
}

/* ============================================
   ANIMATIONS
   ============================================ */

@keyframes spin-b-dz7ziknkyg {
    to {
        transform: rotate(360deg);
    }
}

@keyframes slideIn-b-dz7ziknkyg {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1200px) {
    .theme-layout[b-dz7ziknkyg] {
        grid-template-columns: 1fr 400px;
    }

    .preview-window[b-dz7ziknkyg] {
        height: 450px;
    }
}

@media (max-width: 1024px) {
    .theme-layout[b-dz7ziknkyg] {
        grid-template-columns: 1fr;
    }

    .theme-preview[b-dz7ziknkyg] {
        order: -1;
    }

    .preview-sticky[b-dz7ziknkyg] {
        position: static;
    }

    .preview-window[b-dz7ziknkyg] {
        height: 400px;
    }
}

@media (max-width: 768px) {
    .page-container[b-dz7ziknkyg] {
        padding: 1rem;
    }

    .settings-tabs[b-dz7ziknkyg] {
        grid-template-columns: 1fr;
    }

    .tab-btn[b-dz7ziknkyg] {
        flex-direction: row;
        justify-content: flex-start;
        padding: 1rem 1.25rem;
    }

    .settings-grid-modern[b-dz7ziknkyg] {
        grid-template-columns: 1fr;
    }

    .action-bar[b-dz7ziknkyg] {
        flex-direction: column;
    }

    .btn-action[b-dz7ziknkyg] {
        width: 100%;
    }

    .preview-window[b-dz7ziknkyg] {
        grid-template-columns: 160px 1fr;
        height: 350px;
    }

    .mock-logo[b-dz7ziknkyg] {
        padding: 0.875rem 0.75rem;
    }

    .mock-logo-title[b-dz7ziknkyg] {
        font-size: 0.8125rem;
    }

    .mock-logo-subtitle[b-dz7ziknkyg] {
        font-size: 0.625rem;
    }

    .mock-menu[b-dz7ziknkyg] {
        padding: 0.75rem 0.5rem;
    }

    .mock-menu-item[b-dz7ziknkyg] {
        padding: 0.5rem 0.625rem;
        font-size: 0.6875rem;
        gap: 0.5rem;
    }

    .mock-menu-item svg[b-dz7ziknkyg] {
        width: 14px;
        height: 14px;
    }
}

@media (max-width: 480px) {
    .page-title[b-dz7ziknkyg] {
        font-size: 1.5rem;
    }

    .tab-content[b-dz7ziknkyg] {
        padding: 1rem;
    }

    .color-card[b-dz7ziknkyg],
    .toggle-card[b-dz7ziknkyg],
    .branding-card[b-dz7ziknkyg] {
        padding: 1rem;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/Positions/PositionsList.razor.rz.scp.css */
/* PositionsList.razor.css - Blazor CSS Isolation */

/* Page Layout */
.page-container[b-suww4rghqo] {
    padding: 16px;
    max-width: none;
    width: 100%;
    margin: 0;
}

.loading-container[b-suww4rghqo], .auth-error[b-suww4rghqo] {
    padding: 60px 20px;
    text-align: center;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 16px;
}

.loading-spinner[b-suww4rghqo] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-suww4rghqo 1s linear infinite;
    margin: 0 auto 16px;
}

@keyframes spin-b-suww4rghqo {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-suww4rghqo], .auth-error-title[b-suww4rghqo] {
    font-size: 18px;
    font-weight: 500;
    color: #495057;
    margin: 0;
}

.auth-error-icon[b-suww4rghqo] {
    font-size: 48px;
    margin-bottom: 16px;
}

/* Page Title */
.page-title[b-suww4rghqo] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin-bottom: 1.5rem;
}

/* Paper Component */
.paper[b-suww4rghqo] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 16px;
    box-sizing: border-box;
    width: 100%;
}

/* Button Styles */
.btn[b-suww4rghqo] {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
}

.btn-primary[b-suww4rghqo] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-suww4rghqo] {
    background: #0056b3;
}

.btn:disabled[b-suww4rghqo] {
    opacity: 0.5;
    cursor: not-allowed !important;
}

.btn-secondary[b-suww4rghqo] {
    background: #6c757d;
    color: white;
}

.btn-danger[b-suww4rghqo] {
    background: #dc3545;
    color: white;
}

.btn-outline[b-suww4rghqo] {
    background: transparent;
    border: 1px solid #ced4da;
    color: #495057;
}

.btn-sm[b-suww4rghqo] {
    padding: 6px 12px;
    font-size: 12px;
}

/* Data Table */
.data-table[b-suww4rghqo] {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.data-table th[b-suww4rghqo] {
    background: #f8f9fa;
    padding: 12px;
    text-align: left;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #dee2e6;
    border-right: 1px solid #dee2e6;
}

.data-table th:last-child[b-suww4rghqo] {
    border-right: none;
}

.data-table td[b-suww4rghqo] {
    padding: 12px;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    vertical-align: middle;
    text-align: center;
}

.data-table td:last-child[b-suww4rghqo] {
    border-right: none;
}

.data-table td.text-center[b-suww4rghqo] {
    text-align: center;
}

.cell-content[b-suww4rghqo] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    line-height: 1.4;
}

.cell-content-center[b-suww4rghqo] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
}

.data-table tr:hover[b-suww4rghqo] {
    background: #f8f9fa;
}

/* Position Info */
.position-info[b-suww4rghqo] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
}

.position-title[b-suww4rghqo] {
    font-weight: 600;
    color: #ff6600;
    margin: 0;
    font-size: 16px;
}

.position-subtitle[b-suww4rghqo] {
    font-size: 12px;
    color: #6c757d;
    margin: 0;
}

.mobile-extra-info[b-suww4rghqo] {
    display: none;
    margin-top: 8px;
}

.mobile-extra-info p[b-suww4rghqo] {
    margin: 2px 0;
    font-size: 12px;
    color: #6c757d;
}

/* Badge - Application Count */
.data-table .badge[b-suww4rghqo],
.data-table span.badge[b-suww4rghqo],
span.badge.badge-info[b-suww4rghqo],
.badge[b-suww4rghqo] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 50% !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: white !important;
    background: #17a2b8 !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    line-height: 1 !important;
    text-align: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

.data-table .badge.badge-info[b-suww4rghqo],
.data-table span.badge-info[b-suww4rghqo],
span.badge.badge-info[b-suww4rghqo],
.badge.badge-info[b-suww4rghqo] {
    background: #dc3545 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 32px !important;
    height: 32px !important;
}

.data-table .badge.badge-warning[b-suww4rghqo],
.data-table span.badge-warning[b-suww4rghqo],
span.badge.badge-warning[b-suww4rghqo],
.badge.badge-warning[b-suww4rghqo] {
    background: #ffc107 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 32px !important;
    height: 32px !important;
}

.data-table .badge.badge-success[b-suww4rghqo],
.data-table span.badge-success[b-suww4rghqo],
span.badge.badge-success[b-suww4rghqo],
.badge.badge-success[b-suww4rghqo] {
    background: #28a745 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 32px !important;
    height: 32px !important;
}

/* Utility Classes */
.text-center[b-suww4rghqo] {
    text-align: center;
}

.d-none-xs[b-suww4rghqo] {
    display: none;
}

.d-inline-xs[b-suww4rghqo] {
    display: inline;
}

@media (min-width: 576px) {
    .d-none-xs[b-suww4rghqo] {
        display: inline;
    }
    .d-inline-xs[b-suww4rghqo] {
        display: none;
    }
}

/* Responsive Visibility */
@media (max-width: 767px) {
    .hide-mobile[b-suww4rghqo] {
        display: none !important;
    }

    .mobile-extra-info[b-suww4rghqo] {
        display: block;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .tablet-hide[b-suww4rghqo] {
        display: none !important;
    }
}

/* Empty State */
.empty-state[b-suww4rghqo] {
    padding: 64px 32px;
    text-align: center;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.empty-state-icon[b-suww4rghqo] {
    font-size: 64px;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-state-title[b-suww4rghqo] {
    font-size: 24px;
    font-weight: 600;
    color: #495057;
    margin-bottom: 8px;
}

.empty-state-message[b-suww4rghqo] {
    font-size: 16px;
    color: #6c757d;
    margin: 0;
}

/* Mobile Card View */
.mobile-card-view[b-suww4rghqo] {
    display: none;
}

@media (max-width: 480px) {
    .desktop-table-container[b-suww4rghqo] {
        display: none;
    }

    .mobile-card-view[b-suww4rghqo] {
        display: block;
    }
}

.position-card[b-suww4rghqo] {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
    margin-left: auto;
    margin-right: auto;
    background: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    max-width: 600px;
}

.position-card-header[b-suww4rghqo] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.position-card-title[b-suww4rghqo] {
    font-size: 18px;
    font-weight: 600;
    color: #ff6600;
    margin: 0 0 4px 0;
}

.position-card-subtitle[b-suww4rghqo] {
    font-size: 12px;
    color: #6c757d;
    margin: 0;
}

.position-card-info[b-suww4rghqo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.position-card-info-item[b-suww4rghqo] {
    display: flex;
    flex-direction: column;
    padding: 8px;
    border: 1px solid #f0f0f0;
    border-radius: 4px;
    background: #fafafa;
}

.position-card-info-label[b-suww4rghqo] {
    font-size: 12px;
    color: #6c757d;
    margin-bottom: 4px;
}

.position-card-info-value[b-suww4rghqo] {
    font-size: 14px;
    color: #212529;
    font-weight: 500;
}

.position-card-bottom[b-suww4rghqo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
}

.position-card-bottom .position-card-info-item[b-suww4rghqo] {
    flex: 1 1 0;
    min-width: 0;
}

.position-card-actions[b-suww4rghqo] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex: 1 1 0;
    min-width: 0;
}

.position-card-actions .action-buttons[b-suww4rghqo] {
    display: flex;
    gap: 8px;
}

.position-card-actions .action-btn[b-suww4rghqo] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 8px !important;
    min-height: 32px !important;
    min-width: 32px !important;
    font-size: 0 !important;
    background: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
}

.position-card-actions .action-btn svg[b-suww4rghqo] {
    width: 18px !important;
    height: 18px !important;
}

.position-card-actions .action-btn-text[b-suww4rghqo] {
    display: none !important;
}

.position-card-actions .action-btn.view-btn:hover[b-suww4rghqo] {
    background: #007bff !important;
    color: white !important;
    border-color: #007bff !important;
}

.position-card-actions .action-btn.edit-btn:hover[b-suww4rghqo] {
    background: #28a745 !important;
    color: white !important;
    border-color: #28a745 !important;
}

.position-card-actions .action-btn.delete-btn:hover[b-suww4rghqo] {
    background: #dc3545 !important;
    color: white !important;
    border-color: #dc3545 !important;
}

/* Actions Header */
.actions-header[b-suww4rghqo] {
    white-space: nowrap;
}

.actions-text-mobile[b-suww4rghqo] {
    display: none;
}

.actions-text-full[b-suww4rghqo] {
    display: inline;
}

/* Actions Column Width */
.actions-column[b-suww4rghqo] {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    padding: 16px 20px !important;
}

.mobile-actions-column[b-suww4rghqo] {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    padding: 16px 20px !important;
}

/* Center All Table Headings */
.data-table th[b-suww4rghqo] {
    text-align: center !important;
}

@media (max-width: 768px) {
    .page-header h1[b-suww4rghqo] {
        font-size: 1.75rem;
    }
}

@media (max-width: 576px) {
    /* Show abbreviated actions header on mobile */
    .actions-text-full[b-suww4rghqo] {
        display: none;
    }

    .actions-text-mobile[b-suww4rghqo] {
        display: inline;
        font-size: 18px;
        letter-spacing: 2px;
    }

    /* Hide badge text on mobile */
    .badge-text-full[b-suww4rghqo] {
        display: none;
    }

    /* Tighter action button spacing on mobile */
    .action-buttons[b-suww4rghqo] {
        gap: 8px !important;
    }

    .action-btn[b-suww4rghqo] {
        min-width: 32px !important;
        min-height: 32px !important;
        padding: 6px !important;
    }

    /* Adjust actions column width on mobile */
    .actions-column[b-suww4rghqo],
    .mobile-actions-column[b-suww4rghqo] {
        width: 120px !important;
        min-width: 120px !important;
        max-width: 120px !important;
        padding: 8px !important;
    }

    .page-container[b-suww4rghqo] {
        padding: 12px;
        margin: 0 auto;
    }
}

@media (max-width: 576px) {
    /* Better mobile layout */
    .position-card[b-suww4rghqo] {
        max-width: 100%;
        padding: 14px;
    }

    .position-card-bottom[b-suww4rghqo] {
        gap: 10px;
    }

    .position-card-bottom .position-card-info-item[b-suww4rghqo] {
        max-width: 120px;
        font-size: 13px;
    }

    .position-card-info-label[b-suww4rghqo] {
        font-size: 11px;
    }

    .position-card-info-value[b-suww4rghqo] {
        font-size: 13px;
    }

    .position-card-actions .action-btn[b-suww4rghqo] {
        min-width: 36px !important;
        min-height: 36px !important;
        padding: 8px !important;
    }

    .position-card-actions .action-btn svg[b-suww4rghqo] {
        width: 16px !important;
        height: 16px !important;
    }
}

@media (max-width: 400px) {
    /* Stack on very small screens */
    .position-card-bottom[b-suww4rghqo] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .position-card-bottom .position-card-info-item[b-suww4rghqo] {
        max-width: 100%;
    }

    .position-card-actions[b-suww4rghqo] {
        width: 100%;
        justify-content: flex-start;
    }
}

/* Toggle Active Button */
.toggle-active-btn[b-suww4rghqo] {
    padding: 6px 16px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    background: white;
}

.toggle-active-btn.active[b-suww4rghqo] {
    color: #28a745;
    border-color: #28a745;
    background: #f0fff4;
}

.toggle-active-btn.active:hover[b-suww4rghqo] {
    background: #28a745;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(40, 167, 69, 0.2);
}

.toggle-active-btn.inactive[b-suww4rghqo] {
    color: #6c757d;
    border-color: #6c757d;
    background: #f8f9fa;
}

.toggle-active-btn.inactive:hover[b-suww4rghqo] {
    background: #6c757d;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(108, 117, 125, 0.2);
}

/* Column Width Definitions */
.title-column[b-suww4rghqo] {
    width: 22%;
    min-width: 180px;
}

.active-column[b-suww4rghqo] {
    width: 100px;
    min-width: 100px;
}

.department-column[b-suww4rghqo] {
    width: 14%;
    min-width: 120px;
    max-width: 180px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.location-column[b-suww4rghqo] {
    width: 18%;
    min-width: 170px;
    max-width: 200px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.apps-column[b-suww4rghqo] {
    width: 70px;
    min-width: 70px;
}

.status-column[b-suww4rghqo] {
    width: 100px;
    min-width: 100px;
}

/* Active/Inactive Status Badges */
[b-suww4rghqo] .status-badge.active {
    background: #10b981 !important;
    color: #ffffff !important;
    border: 1px solid #059669 !important;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(16, 185, 129, 0.3);
}

[b-suww4rghqo] .status-badge.inactive {
    background: #ef4444 !important;
    color: #ffffff !important;
    border: 1px solid #dc2626 !important;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(239, 68, 68, 0.3);
}
/* _content/Hirelab-frontend/Components/Pages/Employee/QuestionTemplates/DepartmentManagement.razor.rz.scp.css */
/* Loading State */
.loading-state[b-ylytavxbqy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.spinner[b-ylytavxbqy] {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border-color);
    border-top: 3px solid var(--primary);
    border-radius: 50%;
    animation: spin-b-ylytavxbqy 1s linear infinite;
}

@keyframes spin-b-ylytavxbqy {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-state p[b-ylytavxbqy] {
    margin-top: 16px;
    font-size: 14px;
    color: var(--text-secondary);
}

/* Add Department Section */
.add-department-section[b-ylytavxbqy] {
    background: white;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    border: 1px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.section-title[b-ylytavxbqy] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
}

.add-department-form[b-ylytavxbqy] {
    display: flex;
    gap: 12px;
}

.form-input[b-ylytavxbqy] {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 14px;
    transition: all 0.2s;
    background: white;
}

.form-input:focus[b-ylytavxbqy] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-input:disabled[b-ylytavxbqy] {
    background: #e9ecef;
    cursor: not-allowed;
    opacity: 0.6;
}

.btn[b-ylytavxbqy] {
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.btn-primary[b-ylytavxbqy] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-ylytavxbqy] {
    background: #0056b3;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.btn:disabled[b-ylytavxbqy] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* Messages */
.message[b-ylytavxbqy] {
    margin-top: 12px;
    padding: 12px 16px;
    border-radius: 6px;
    font-size: 14px;
}

.message.success[b-ylytavxbqy] {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.message.error[b-ylytavxbqy] {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

.message.warning[b-ylytavxbqy] {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffeaa7;
}

/* Departments List Section */
.departments-list-section[b-ylytavxbqy] {
    background: white;
    border-radius: 8px;
    padding: 24px;
    border: 1px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    max-height: 600px;
}

.section-header[b-ylytavxbqy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 2px solid #e9ecef;
    flex-shrink: 0;
}

.department-count[b-ylytavxbqy] {
    font-size: 14px;
    color: #6c757d;
    font-weight: 500;
}

/* Search Bar */
.search-bar[b-ylytavxbqy] {
    position: relative;
    margin-bottom: 20px;
    width: 100%;
    flex-shrink: 0;
}

.search-input[b-ylytavxbqy] {
    width: 100%;
    padding: 10px 40px 10px 14px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 14px;
    transition: all 0.2s;
    background: white;
    box-sizing: border-box;
}

.search-input:focus[b-ylytavxbqy] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.search-clear[b-ylytavxbqy] {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    font-size: 24px;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s;
}

.search-clear:hover[b-ylytavxbqy] {
    background: #f8f9fa;
    color: #212529;
}

.btn-link[b-ylytavxbqy] {
    background: transparent;
    color: #007bff;
    padding: 8px 16px;
    border: none;
    cursor: pointer;
    font-size: 14px;
    text-decoration: underline;
    margin-top: 8px;
}

.btn-link:hover[b-ylytavxbqy] {
    color: #0056b3;
}

/* Departments Table */
.departments-table[b-ylytavxbqy] {
    overflow-y: auto;
    overflow-x: auto;
    border-radius: 6px;
    border: 1px solid #e9ecef;
    flex: 1;
    min-height: 0;
}

/* Custom Scrollbar */
.departments-table[b-ylytavxbqy]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.departments-table[b-ylytavxbqy]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.departments-table[b-ylytavxbqy]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}

.departments-table[b-ylytavxbqy]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

.departments-table table[b-ylytavxbqy] {
    width: 100%;
    border-collapse: collapse;
}

.departments-table thead[b-ylytavxbqy] {
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
    position: sticky;
    top: 0;
    z-index: 10;
}

.departments-table th[b-ylytavxbqy] {
    padding: 12px 16px;
    text-align: left;
    font-size: 11px;
    font-weight: 700;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: #f8f9fa;
}

.departments-table tbody tr[b-ylytavxbqy] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.2s;
}

.departments-table tbody tr:last-child[b-ylytavxbqy] {
    border-bottom: none;
}

.departments-table tbody tr:hover[b-ylytavxbqy] {
    background: #f8f9fa;
}

.departments-table td[b-ylytavxbqy] {
    padding: 14px 16px;
}

.dept-name[b-ylytavxbqy] {
    font-weight: 500;
    color: #212529;
}

/* Status Badge */
.status-badge[b-ylytavxbqy] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.status-badge.active[b-ylytavxbqy] {
    background: #d4edda;
    color: #155724;
}

.status-badge.inactive[b-ylytavxbqy] {
    background: #f8d7da;
    color: #721c24;
}

/* Inline Status Toggle */
.status-toggle-inline[b-ylytavxbqy] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.status-label[b-ylytavxbqy] {
    font-size: 13px;
    font-weight: 500;
    color: #495057;
    white-space: nowrap;
}

/* Delete Button */
.btn-icon[b-ylytavxbqy] {
    background: transparent;
    border: none;
    padding: 8px;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-icon:hover:not(:disabled)[b-ylytavxbqy] {
    background: #f8f9fa;
}

.btn-icon:disabled[b-ylytavxbqy] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-delete[b-ylytavxbqy] {
    color: #dc3545;
}

.btn-delete:hover:not(:disabled)[b-ylytavxbqy] {
    background: #fff5f5;
    color: #c82333;
}

.btn-icon .icon[b-ylytavxbqy] {
    width: 18px;
    height: 18px;
}

/* Protected Label */
.protected-label[b-ylytavxbqy] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background-color: #fff3cd;
    color: #856404;
    border: 1px solid #ffeaa7;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: help;
}

.protected-label:hover[b-ylytavxbqy] {
    background-color: #ffe69c;
    border-color: #ffd700;
}

/* Menu Container */
.menu-container[b-ylytavxbqy] {
    position: relative;
}

.menu-button[b-ylytavxbqy] {
    background: transparent;
    border: none;
    padding: 6px 10px;
    font-size: 18px;
    color: #6c757d;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s;
    line-height: 1;
}

.menu-button:hover[b-ylytavxbqy] {
    background: #f8f9fa;
    color: #212529;
}

.dropdown-menu[b-ylytavxbqy] {
    position: absolute;
    right: 0;
    top: 100%;
    margin-top: 4px;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    min-width: 140px;
    z-index: 1000;
    overflow: hidden;
}

.menu-item[b-ylytavxbqy] {
    display: block;
    width: 100%;
    padding: 10px 16px;
    border: none;
    background: transparent;
    text-align: left;
    font-size: 14px;
    color: #212529;
    cursor: pointer;
    transition: all 0.2s;
}

.menu-item:hover[b-ylytavxbqy] {
    background: #f8f9fa;
}

.menu-item.danger[b-ylytavxbqy] {
    color: #dc3545;
}

.menu-item.danger:hover[b-ylytavxbqy] {
    background: #fff5f5;
    color: #c82333;
}

/* Empty State */
.empty-state[b-ylytavxbqy] {
    text-align: center;
    padding: 60px 20px;
    color: var(--text-secondary);
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.empty-state p[b-ylytavxbqy] {
    margin: 0;
    font-size: 14px;
}

/* Modal Overlay */
.modal-overlay[b-ylytavxbqy] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-ylytavxbqy] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 500px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-ylytavxbqy] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-ylytavxbqy] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

/* Modal Content */
.modal-content[b-ylytavxbqy] {
    padding: 0;
    overflow-y: auto;
    flex: 1;
}

.modal-body[b-ylytavxbqy] {
    padding: 24px;
}

/* Form Section */
.form-section[b-ylytavxbqy] {
    margin-bottom: 24px;
}

.form-section:last-child[b-ylytavxbqy] {
    margin-bottom: 0;
}

.form-label[b-ylytavxbqy] {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #212529;
    margin-bottom: 12px;
}

.field-help[b-ylytavxbqy] {
    font-size: 12px;
    color: #6c757d;
    margin: 8px 0 0 0;
}

/* Status Toggle Section */
.status-toggle-section[b-ylytavxbqy] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.toggle-switch[b-ylytavxbqy] {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 26px;
    cursor: pointer;
}

.toggle-switch input[type="checkbox"][b-ylytavxbqy] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-ylytavxbqy] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #cbd5e0;
    transition: all 0.3s ease;
    border-radius: 26px;
}

.toggle-slider[b-ylytavxbqy]::before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: all 0.3s ease;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.toggle-switch input:checked + .toggle-slider[b-ylytavxbqy] {
    background-color: #28a745;
}

.toggle-switch input:checked + .toggle-slider[b-ylytavxbqy]::before {
    transform: translateX(22px);
}

.toggle-switch input:disabled + .toggle-slider[b-ylytavxbqy] {
    opacity: 0.5;
    cursor: not-allowed;
}

.toggle-switch input:focus + .toggle-slider[b-ylytavxbqy] {
    box-shadow: 0 0 0 3px rgba(40, 167, 69, 0.2);
}

.toggle-label[b-ylytavxbqy] {
    font-size: 14px;
    font-weight: 500;
    color: #212529;
}

/* Danger Section */
.danger-section[b-ylytavxbqy] {
    padding: 16px;
    background: #fff5f5;
    border: 1px solid #f5c6cb;
    border-radius: 6px;
}

.danger-label[b-ylytavxbqy] {
    color: #721c24;
}

.btn-danger[b-ylytavxbqy] {
    background: #dc3545;
    color: white;
}

.btn-danger:hover:not(:disabled)[b-ylytavxbqy] {
    background: #c82333;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(220, 53, 69, 0.3);
}

.btn-secondary[b-ylytavxbqy] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-ylytavxbqy] {
    background: #5a6268;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Modal Actions */
.modal-actions[b-ylytavxbqy] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Responsive */
@media (max-width: 768px) {
    .add-department-form[b-ylytavxbqy] {
        flex-direction: column;
    }

    .section-header[b-ylytavxbqy] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .modal-dialog[b-ylytavxbqy] {
        max-width: 100%;
        margin: 0;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/QuestionTemplates/QuestionTemplates.razor.rz.scp.css */
/* Questions.razor.css - Blazor CSS Isolation */

/* Global Box Sizing */
*[b-3eqyou45n8] {
    box-sizing: border-box;
}

/* Page Container */
.page-container[b-3eqyou45n8] {
    padding: 24px;
    max-width: 100%;
    margin: 0;
    width: 100%;
    box-sizing: border-box;
}

/* Page Header */
.page-header[b-3eqyou45n8] {
    margin-bottom: 24px;
}

.page-title[b-3eqyou45n8] {
    font-size: 2rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 8px 0;
}

.page-subtitle[b-3eqyou45n8] {
    font-size: 1rem;
    color: #6c757d;
    margin: 0 0 16px 0;
}

/* Action Bar */
.action-bar[b-3eqyou45n8] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
    box-sizing: border-box;
    width: 100%;
}

.search-controls[b-3eqyou45n8] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    align-items: stretch;
    min-width: 0;
    flex: 1;
}

.search-controls .template-status-toggle[b-3eqyou45n8] {
    flex-shrink: 0;
    align-self: flex-start;
}

.search-field[b-3eqyou45n8] {
    width: 100%;
    min-width: 0;
}

.department-select[b-3eqyou45n8] {
    width: 100%;
    min-width: 0;
}

/* Action Controls */
.action-controls[b-3eqyou45n8] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    align-items: stretch;
    flex-shrink: 0;
}

/* Form Elements */
.form-input[b-3eqyou45n8], .form-select[b-3eqyou45n8] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 40px;
}

.form-input:focus[b-3eqyou45n8], .form-select:focus[b-3eqyou45n8] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-3eqyou45n8], .form-select:hover:not(:focus)[b-3eqyou45n8] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-3eqyou45n8]::placeholder {
    color: #6b7280;
    opacity: 1;
}

.form-select[b-3eqyou45n8] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 48px;
    cursor: pointer;
}

.form-select:focus[b-3eqyou45n8] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23594ae2' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}

/* Buttons */
.btn[b-3eqyou45n8] {
    padding: 10px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn-primary[b-3eqyou45n8] {
    background: #007bff;
    color: white;
}

.btn-primary:hover[b-3eqyou45n8] {
    background: #0056b3;
}

.btn-outline[b-3eqyou45n8] {
    background: transparent;
    color: #007bff;
    border: 1px solid #007bff;
}

.btn-outline:hover[b-3eqyou45n8] {
    background: #007bff;
    color: white;
}

.btn-danger[b-3eqyou45n8] {
    background: #dc3545;
    color: white;
}

.btn-danger:hover[b-3eqyou45n8] {
    background: #c82333;
}

.btn-sm[b-3eqyou45n8] {
    padding: 6px 12px;
    font-size: 12px;
    min-height: 32px;
}

/* Template Cards */
.templates-container[b-3eqyou45n8] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    box-sizing: border-box;
}

.template-card[b-3eqyou45n8] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    width: 100%;
}

.template-header[b-3eqyou45n8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 12px;
}

.template-title-section[b-3eqyou45n8] {
    flex: 1;
    min-width: 0;
}

.template-title-row[b-3eqyou45n8] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.template-title[b-3eqyou45n8] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.template-description[b-3eqyou45n8] {
    font-size: 14px;
    color: #6c757d;
    margin: 0;
    line-height: 1.5;
}

.template-actions[b-3eqyou45n8] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* Template Info Grid */
.template-info[b-3eqyou45n8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.info-item[b-3eqyou45n8] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-label[b-3eqyou45n8] {
    font-size: 12px;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    font-weight: 600;
}

.info-value[b-3eqyou45n8] {
    font-size: 14px;
    color: #212529;
    font-weight: 500;
}

/* Badge Group */
.badge-group[b-3eqyou45n8] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Status Badges */
.status-badge[b-3eqyou45n8] {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.status-badge.active[b-3eqyou45n8] {
    background: #d4edda;
    color: #155724;
}

.status-badge.inactive[b-3eqyou45n8] {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.legacy[b-3eqyou45n8] {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffeeba;
}

/* Loading and Empty States */
.loading-container[b-3eqyou45n8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.loading-spinner[b-3eqyou45n8] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-3eqyou45n8 1s linear infinite;
}

.loading-text[b-3eqyou45n8] {
    margin-top: 16px;
    font-size: 1.125rem;
    color: #6c757d;
}

.empty-state[b-3eqyou45n8] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
}

.empty-state-icon[b-3eqyou45n8] {
    font-size: 4rem;
    color: #6c757d;
    margin-bottom: 16px;
}

.empty-state-title[b-3eqyou45n8] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #495057;
}

.empty-state-message[b-3eqyou45n8] {
    font-size: 14px;
    margin: 0 0 24px 0;
    color: #6c757d;
}

.auth-required[b-3eqyou45n8] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
}

.auth-icon[b-3eqyou45n8] {
    font-size: 4rem;
    color: #dc3545;
    margin-bottom: 16px;
}

.auth-title[b-3eqyou45n8] {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
    color: #495057;
}

@keyframes spin-b-3eqyou45n8 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (min-width: 576px) {
    .action-bar[b-3eqyou45n8] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;
    }

    .search-controls[b-3eqyou45n8] {
        flex-direction: row;
        width: auto;
        gap: 12px;
        align-items: center;
        flex: 1;
        min-width: 300px;
        max-width: 600px;
    }

    .search-controls .template-status-toggle[b-3eqyou45n8] {
        align-self: center;
    }

    .search-field[b-3eqyou45n8] {
        flex: 1;
        min-width: 250px;
        max-width: 400px;
    }

    .department-select[b-3eqyou45n8] {
        width: 200px;
        min-width: 200px;
        flex-shrink: 0;
    }

    .action-controls[b-3eqyou45n8] {
        width: auto;
        flex-shrink: 0;
        align-items: center;
        min-width: fit-content;
    }
}

@media (min-width: 768px) {
    .page-container[b-3eqyou45n8] {
        padding: 32px;
    }

    .page-title[b-3eqyou45n8] {
        font-size: 2.5rem;
        margin-bottom: 12px;
    }

    .template-info[b-3eqyou45n8] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1200px) {
    .action-bar[b-3eqyou45n8] {
        gap: 20px;
        flex-wrap: nowrap;
    }
}

@media (max-width: 767px) {
    .page-container[b-3eqyou45n8] {
        padding: 16px;
    }

    .action-bar[b-3eqyou45n8] {
        padding: 14px;
    }
}

@media (max-width: 575px) {
    .page-container[b-3eqyou45n8] {
        padding: 12px;
        margin: 0 auto;
    }

    .page-title[b-3eqyou45n8] {
        font-size: 1.5rem;
    }

    .page-subtitle[b-3eqyou45n8] {
        font-size: 0.875rem;
    }

    .action-bar[b-3eqyou45n8] {
        padding: 12px;
        margin-left: 0;
        margin-right: 0;
    }

    .form-input[b-3eqyou45n8], .form-select[b-3eqyou45n8] {
        padding: 10px 12px;
        font-size: 14px;
    }

    .form-select[b-3eqyou45n8] {
        background-position: right 12px center;
        padding-right: 40px;
    }

    .template-header[b-3eqyou45n8] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .template-actions[b-3eqyou45n8] {
        width: 100%;
        justify-content: flex-start;
    }

    .action-controls[b-3eqyou45n8] {
        width: 100%;
    }

    .btn[b-3eqyou45n8] {
        width: 100%;
        justify-content: center;
    }

    .template-card[b-3eqyou45n8] {
        padding: 16px;
    }

    .template-title[b-3eqyou45n8] {
        font-size: 1.125rem;
    }
}

@media (max-width: 400px) {
    .page-container[b-3eqyou45n8] {
        padding: 10px;
    }

    .action-bar[b-3eqyou45n8] {
        padding: 10px;
        gap: 12px;
    }

    .form-input[b-3eqyou45n8], .form-select[b-3eqyou45n8] {
        padding: 8px 10px;
        font-size: 14px;
    }

    .form-select[b-3eqyou45n8] {
        background-position: right 10px center;
        padding-right: 36px;
    }

    .template-card[b-3eqyou45n8] {
        padding: 12px;
    }

    .page-title[b-3eqyou45n8] {
        font-size: 1.375rem;
    }
}

/* ========================================
   DEPARTMENTS TAB - Now in separate component
   ======================================== */

/* Candidates Card - Tabs Container */
.candidates-card[b-3eqyou45n8] {
    background: white;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
}

/* Tabs Navigation */
.tabs-navigation[b-3eqyou45n8] {
    display: flex;
    gap: 4px;
    padding: 20px 24px 0;
    border-bottom: 1px solid #e9ecef;
}

.tab-btn[b-3eqyou45n8] {
    padding: 12px 24px;
    border: 1px solid #e9ecef;
    border-bottom: none;
    background: #f8f9fa;
    color: #495057;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 8px 8px 0 0;
    transition: all 0.2s ease;
    margin-right: 4px;
    position: relative;
}

.tab-btn:hover:not(:disabled):not(.active)[b-3eqyou45n8] {
    color: #007bff;
    background: #e7f1ff;
    border-color: #d3dce6;
}

.tab-btn.active[b-3eqyou45n8] {
    color: #007bff;
    background: white;
    font-weight: 600;
    border-color: #e9ecef;
    border-bottom: 3px solid #007bff;
    z-index: 1;
}

.tab-btn:disabled[b-3eqyou45n8] {
    opacity: 0.5;
    cursor: not-allowed;
}

@media (max-width: 768px) {
    .tabs-navigation[b-3eqyou45n8] {
        flex-wrap: wrap;
    }

    .tab-btn[b-3eqyou45n8] {
        padding: 10px 16px;
        font-size: 13px;
    }
}

/* Template Status Toggle Container */
.template-status-toggle[b-3eqyou45n8] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    white-space: nowrap;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddCandidateForm.razor.rz.scp.css */
/* AddCandidateForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-fhvdpbvcsi] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-fhvdpbvcsi] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-fhvdpbvcsi] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-fhvdpbvcsi] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.modal-icon[b-fhvdpbvcsi] {
    font-size: 20px;
    color: var(--tenant-primary-color, #007bff);
}

/* Modal Content */
.modal-content[b-fhvdpbvcsi] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Form Styling */
.dialog-content-wrapper[b-fhvdpbvcsi] {
    padding: 0;
    max-width: 100%;
    margin: 0;
}

.form-container[b-fhvdpbvcsi] {
    padding: 0;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

.form-grid[b-fhvdpbvcsi] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-fhvdpbvcsi] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-fhvdpbvcsi] {
    grid-column: 1 / -1;
}

.form-field.half-width[b-fhvdpbvcsi] {
    grid-column: span 1;
}

.form-label[b-fhvdpbvcsi] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
    display: block;
    letter-spacing: -0.025em;
}

.form-input[b-fhvdpbvcsi], .form-select[b-fhvdpbvcsi] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 48px;
}

.form-input:focus[b-fhvdpbvcsi], .form-select:focus[b-fhvdpbvcsi] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-fhvdpbvcsi], .form-select:hover:not(:focus)[b-fhvdpbvcsi] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-fhvdpbvcsi]::placeholder {
    color: #6b7280;
    opacity: 1;
}

.form-input.input-error[b-fhvdpbvcsi], .form-select.input-error[b-fhvdpbvcsi] {
    border-color: #dc3545;
    background-color: #fff5f5;
}

.form-input.input-error:focus[b-fhvdpbvcsi], .form-select.input-error:focus[b-fhvdpbvcsi] {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

.field-validation-error[b-fhvdpbvcsi] {
    display: block;
    color: #dc3545;
    font-size: 0.8125rem;
    margin-top: 4px;
    font-weight: 500;
}

.form-select[b-fhvdpbvcsi] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 48px;
    cursor: pointer;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.form-select:focus[b-fhvdpbvcsi] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23594ae2' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}

.form-select option[b-fhvdpbvcsi] {
    padding: 12px 16px;
    background-color: #ffffff;
    color: #1a1a1a;
    font-size: 0.875rem;
    line-height: 1.5;
    border: none;
    min-height: 44px;
}

.form-select option:hover[b-fhvdpbvcsi] {
    background-color: #f3f4f6;
}

.form-select option:checked[b-fhvdpbvcsi] {
    background-color: #594ae2;
    color: #ffffff;
}

/* Modal Actions */
.modal-actions[b-fhvdpbvcsi] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Button Styles */
.btn[b-fhvdpbvcsi] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn:disabled[b-fhvdpbvcsi] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-fhvdpbvcsi] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-fhvdpbvcsi] {
    background: #5a6268;
}

.btn-primary[b-fhvdpbvcsi] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-fhvdpbvcsi] {
    background: #0056b3;
}

/* Loading Spinner */
.loading-spinner[b-fhvdpbvcsi] {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-fhvdpbvcsi 1s linear infinite;
}

@keyframes spin-b-fhvdpbvcsi {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-fhvdpbvcsi] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }

    .modal-content[b-fhvdpbvcsi] {
        padding: 16px;
    }

    .form-grid[b-fhvdpbvcsi] {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .form-field.half-width[b-fhvdpbvcsi] {
        grid-column: 1;
    }
}

@media (max-width: 480px) {
    .modal-header[b-fhvdpbvcsi] {
        padding: 16px 20px;
    }

    .modal-actions[b-fhvdpbvcsi] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .form-grid[b-fhvdpbvcsi] {
        gap: 16px;
    }

    .form-input[b-fhvdpbvcsi], .form-select[b-fhvdpbvcsi] {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 12px 14px;
        min-height: 44px;
    }

    .btn[b-fhvdpbvcsi] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddClientForm.razor.rz.scp.css */
/* AddClientForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-7c7ze0lo8i] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-7c7ze0lo8i] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-7c7ze0lo8i] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-7c7ze0lo8i] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

/* Modal Content */
.modal-content[b-7c7ze0lo8i] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Form Layout */
.form-container[b-7c7ze0lo8i] {
    padding: 0;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

.form-grid[b-7c7ze0lo8i] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-7c7ze0lo8i] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-7c7ze0lo8i] {
    grid-column: 1 / -1;
}

.form-field.half-width[b-7c7ze0lo8i] {
    grid-column: span 1;
}

/* Form Labels */
.form-label[b-7c7ze0lo8i] {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
    display: block;
    letter-spacing: -0.025em;
}

/* Form Inputs */
.form-input[b-7c7ze0lo8i], .form-select[b-7c7ze0lo8i] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 14px;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 44px;
}

.form-input:focus[b-7c7ze0lo8i], .form-select:focus[b-7c7ze0lo8i] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-7c7ze0lo8i], .form-select:hover:not(:focus)[b-7c7ze0lo8i] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-7c7ze0lo8i]::placeholder {
    color: #6b7280;
    opacity: 1;
}

.form-select option[b-7c7ze0lo8i] {
    padding: 12px 16px;
    background-color: #ffffff;
    color: #1a1a1a;
    font-size: 14px;
    line-height: 1.5;
    border: none;
    min-height: 40px;
}

/* Modal Actions */
.modal-actions[b-7c7ze0lo8i] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Button Styles */
.btn[b-7c7ze0lo8i] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn:disabled[b-7c7ze0lo8i] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-cancel[b-7c7ze0lo8i] {
    background: transparent;
    color: #6c757d;
    border: 1px solid #ced4da;
}

.btn-cancel:hover:not(:disabled)[b-7c7ze0lo8i] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.btn-primary[b-7c7ze0lo8i] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-7c7ze0lo8i] {
    background: #0056b3;
}

/* Loading State */
.loading-spinner[b-7c7ze0lo8i] {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-7c7ze0lo8i 1s linear infinite;
    margin-right: 8px;
}

@keyframes spin-b-7c7ze0lo8i {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-7c7ze0lo8i] {
    margin-left: 4px;
}

/* Responsive Design */
@media (max-width: 500px) {
    .form-grid[b-7c7ze0lo8i] {
        grid-template-columns: 1fr !important;
        gap: 18px;
    }

    .form-field.half-width[b-7c7ze0lo8i] {
        grid-column: 1 !important;
    }

    .modal-dialog[b-7c7ze0lo8i] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }
}

@media (max-width: 480px) {
    .modal-content[b-7c7ze0lo8i] {
        padding: 16px;
    }

    .modal-header[b-7c7ze0lo8i] {
        padding: 16px 20px;
    }

    .modal-actions[b-7c7ze0lo8i] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .form-grid[b-7c7ze0lo8i] {
        gap: 16px;
    }

    .form-input[b-7c7ze0lo8i], .form-select[b-7c7ze0lo8i] {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 12px 14px;
        min-height: 44px;
    }
}

/* Focus and validation states */
.form-input:invalid[b-7c7ze0lo8i] {
    border-color: #dc3545;
}

.form-input:valid[b-7c7ze0lo8i] {
    border-color: #28a745;
}

/* Error state */
.error-message[b-7c7ze0lo8i] {
    color: #dc3545;
    font-size: 12px;
    margin-top: 4px;
}

/* Success state */
.success-message[b-7c7ze0lo8i] {
    color: #28a745;
    font-size: 12px;
    margin-top: 4px;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddEmployeeForm.razor.rz.scp.css */
/* AddEmployeeForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-7u71na9wxh] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-7u71na9wxh] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-7u71na9wxh] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-7u71na9wxh] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

/* Modal Content */
.modal-content[b-7u71na9wxh] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Form Styling */
.dialog-content-wrapper[b-7u71na9wxh] {
    padding: 0;
    max-width: 100%;
    margin: 0;
}

.form-container[b-7u71na9wxh] {
    padding: 0;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

.form-grid[b-7u71na9wxh] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-7u71na9wxh] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-7u71na9wxh] {
    grid-column: 1 / -1;
}

.form-field.half-width[b-7u71na9wxh] {
    grid-column: span 1;
}

.form-label[b-7u71na9wxh] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
    display: block;
    letter-spacing: -0.025em;
}

.form-input[b-7u71na9wxh], .form-select[b-7u71na9wxh] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 48px;
}

.form-input:focus[b-7u71na9wxh], .form-select:focus[b-7u71na9wxh] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-7u71na9wxh], .form-select:hover:not(:focus)[b-7u71na9wxh] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-7u71na9wxh]::placeholder {
    color: #6b7280;
    opacity: 1;
}

.form-select[b-7u71na9wxh] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 48px;
    cursor: pointer;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.form-select:focus[b-7u71na9wxh] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23594ae2' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}

.form-select option[b-7u71na9wxh] {
    padding: 12px 16px;
    background-color: #ffffff;
    color: #1a1a1a;
    font-size: 0.875rem;
    line-height: 1.5;
    border: none;
    min-height: 44px;
}

.form-select option:hover[b-7u71na9wxh] {
    background-color: #f3f4f6;
}

.form-select option:checked[b-7u71na9wxh] {
    background-color: #594ae2;
    color: #ffffff;
}

/* Switch Styling */
.switch-container[b-7u71na9wxh] {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin: 16px 0;
}

.switch-input[b-7u71na9wxh] {
    display: none;
}

.switch-slider[b-7u71na9wxh] {
    width: 52px;
    height: 28px;
    background-color: #ccc;
    border-radius: 28px;
    position: relative;
    transition: background-color 0.3s;
    margin-right: 12px;
}

.switch-slider[b-7u71na9wxh]::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 24px;
    height: 24px;
    background-color: white;
    border-radius: 50%;
    transition: transform 0.3s;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.switch-input:checked + .switch-slider[b-7u71na9wxh] {
    background-color: #594ae2;
}

.switch-input:checked + .switch-slider[b-7u71na9wxh]::before {
    transform: translateX(24px);
}

.switch-label[b-7u71na9wxh] {
    font-size: 1rem;
    color: #374151;
    user-select: none;
}

/* Info Alert */
.info-alert[b-7u71na9wxh] {
    display: flex;
    align-items: flex-start;
    padding: 16px 20px;
    background-color: #eff6ff;
    border: 1.5px solid #93c5fd;
    border-radius: 8px;
    margin: 8px 0 0 0;
}

.info-icon[b-7u71na9wxh] {
    color: #2563eb;
    font-weight: 600;
    margin-right: 12px;
    margin-top: 1px;
    font-size: 16px;
    flex-shrink: 0;
}

.info-text[b-7u71na9wxh] {
    color: #1e40af;
    font-size: 0.875rem;
    line-height: 1.5;
    margin: 0;
    font-weight: 400;
}

/* Modal Actions */
.modal-actions[b-7u71na9wxh] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Button Styles */
.btn[b-7u71na9wxh] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn:disabled[b-7u71na9wxh] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-7u71na9wxh] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-7u71na9wxh] {
    background: #5a6268;
}

.btn-primary[b-7u71na9wxh] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-7u71na9wxh] {
    background: #0056b3;
}

/* Loading Spinner */
.loading-spinner[b-7u71na9wxh] {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-7u71na9wxh 1s linear infinite;
}

@keyframes spin-b-7u71na9wxh {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-7u71na9wxh] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }

    .modal-content[b-7u71na9wxh] {
        padding: 16px;
    }

    .form-grid[b-7u71na9wxh] {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .form-field.half-width[b-7u71na9wxh] {
        grid-column: 1;
    }
}

@media (max-width: 480px) {
    .modal-header[b-7u71na9wxh] {
        padding: 16px 20px;
    }

    .modal-actions[b-7u71na9wxh] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .form-grid[b-7u71na9wxh] {
        gap: 16px;
    }

    .form-input[b-7u71na9wxh], .form-select[b-7u71na9wxh] {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 12px 14px;
        min-height: 44px;
    }

    .btn[b-7u71na9wxh] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddExistingCandidateDialog.razor.rz.scp.css */
/* AddExistingCandidateDialog.razor.css */

.modal-overlay[b-3hd94jki5p] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
    animation: fadeIn-b-3hd94jki5p 0.2s ease;
}

@keyframes fadeIn-b-3hd94jki5p {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal-container[b-3hd94jki5p] {
    background: white;
    border-radius: 12px;
    max-width: 900px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    animation: slideUp-b-3hd94jki5p 0.3s ease;
}

@keyframes slideUp-b-3hd94jki5p {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-header[b-3hd94jki5p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.modal-title[b-3hd94jki5p] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
}

.modal-close[b-3hd94jki5p] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    transition: all 0.2s;
}

.modal-close:hover[b-3hd94jki5p] {
    background: #f3f4f6;
    color: #374151;
}

.modal-body[b-3hd94jki5p] {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}

.modal-footer[b-3hd94jki5p] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
}

/* Loading State */
.loading-container[b-3hd94jki5p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.loading-spinner[b-3hd94jki5p] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-3hd94jki5p 1s linear infinite;
}

.loading-text[b-3hd94jki5p] {
    margin-top: 16px;
    font-size: 14px;
    color: #6c757d;
}

@keyframes spin-b-3hd94jki5p {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Error State */
.error-message[b-3hd94jki5p] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #991b1b;
}

.error-icon[b-3hd94jki5p] {
    font-size: 1.5rem;
}

/* Empty State */
.empty-state[b-3hd94jki5p] {
    text-align: center;
    padding: 60px 20px;
}

.empty-icon[b-3hd94jki5p] {
    font-size: 4rem;
    color: #9ca3af;
    margin-bottom: 16px;
}

.empty-title[b-3hd94jki5p] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
}

.empty-message[b-3hd94jki5p] {
    font-size: 1rem;
    color: #6b7280;
    max-width: 400px;
    margin: 0 auto;
}

/* Filters */
.filters-container[b-3hd94jki5p] {
    margin-bottom: 24px;
}

.search-field[b-3hd94jki5p] {
    position: relative;
    margin-bottom: 16px;
}

.search-icon[b-3hd94jki5p] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    pointer-events: none;
}

.search-input[b-3hd94jki5p] {
    width: 100%;
    padding: 10px 12px 10px 40px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    transition: border-color 0.2s;
}

.search-input:focus[b-3hd94jki5p] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.filter-row[b-3hd94jki5p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.filter-group[b-3hd94jki5p] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.filter-label[b-3hd94jki5p] {
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-input[b-3hd94jki5p],
.filter-select[b-3hd94jki5p] {
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    transition: border-color 0.2s;
}

.filter-input:focus[b-3hd94jki5p],
.filter-select:focus[b-3hd94jki5p] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

/* Candidates Table */
.candidates-table-container[b-3hd94jki5p] {
    overflow-x: auto;
    margin-bottom: 20px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.candidates-table[b-3hd94jki5p] {
    width: 100%;
    border-collapse: collapse;
}

.candidates-table thead[b-3hd94jki5p] {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.candidates-table th[b-3hd94jki5p] {
    padding: 12px 16px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.candidates-table td[b-3hd94jki5p] {
    padding: 12px 16px;
    border-top: 1px solid #e5e7eb;
    font-size: 14px;
    color: #1f2937;
}

.candidates-table tbody tr:hover[b-3hd94jki5p] {
    background: #f9fafb;
}

/* Buttons */
.btn[b-3hd94jki5p] {
    padding: 10px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn:disabled[b-3hd94jki5p] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary[b-3hd94jki5p] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-3hd94jki5p] {
    background: #0056b3;
}

.btn-secondary[b-3hd94jki5p] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-3hd94jki5p] {
    background: #545b62;
}

.btn-sm[b-3hd94jki5p] {
    padding: 6px 12px;
    font-size: 13px;
}

/* Pagination */
.pagination-container[b-3hd94jki5p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0;
    border-top: 1px solid #e5e7eb;
}

.pagination-info[b-3hd94jki5p] {
    font-size: 14px;
    color: #6b7280;
}

.pagination-controls[b-3hd94jki5p] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pagination-current[b-3hd94jki5p] {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
}

.pagination-btn[b-3hd94jki5p] {
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: white;
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    transition: all 0.2s;
}

.pagination-btn:hover:not(:disabled)[b-3hd94jki5p] {
    background: #f9fafb;
    border-color: #9ca3af;
}

.pagination-btn:disabled[b-3hd94jki5p] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-container[b-3hd94jki5p] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }

    .modal-header[b-3hd94jki5p],
    .modal-body[b-3hd94jki5p],
    .modal-footer[b-3hd94jki5p] {
        padding: 16px;
    }

    .filter-row[b-3hd94jki5p] {
        grid-template-columns: 1fr;
    }

    .hide-mobile[b-3hd94jki5p] {
        display: none !important;
    }

    .pagination-container[b-3hd94jki5p] {
        flex-direction: column;
        gap: 12px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddExistingCandidateInline.razor.rz.scp.css */
/* AddExistingCandidateInline.razor.css - Blazor CSS Isolation */

.add-existing-candidate-content[b-wz7j990gt6] {
    padding: 24px;
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
}

/* Loading State */
.loading-container[b-wz7j990gt6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.loading-spinner[b-wz7j990gt6] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-wz7j990gt6 1s linear infinite;
}

.loading-text[b-wz7j990gt6] {
    margin-top: 16px;
    font-size: 14px;
    color: #6c757d;
}

@keyframes spin-b-wz7j990gt6 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Error and Empty States */
.error-message[b-wz7j990gt6] {
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
    padding: 20px;
    margin: 20px 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.error-icon[b-wz7j990gt6] {
    font-size: 24px;
    color: #721c24;
}

.error-message p[b-wz7j990gt6] {
    margin: 0;
    color: #721c24;
    font-size: 14px;
}

.empty-state[b-wz7j990gt6] {
    text-align: center;
    padding: 60px 20px;
}

.empty-icon[b-wz7j990gt6] {
    font-size: 48px;
    color: #dee2e6;
    margin-bottom: 16px;
}

.empty-title[b-wz7j990gt6] {
    font-size: 18px;
    font-weight: 600;
    color: #495057;
    margin: 0 0 8px 0;
}

.empty-message[b-wz7j990gt6] {
    font-size: 14px;
    color: #6c757d;
    margin: 0;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

/* Paper Container */
.paper[b-wz7j990gt6] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
}

/* Action Bar - Search */
.action-bar[b-wz7j990gt6] {
    padding: 16px;
}

.text-field[b-wz7j990gt6] {
    position: relative;
    width: 100%;
}

@media (min-width: 768px) {
    .text-field.search-field[b-wz7j990gt6] {
        width: auto;
        min-width: 300px;
        max-width: 400px;
    }
}

.text-field input[b-wz7j990gt6] {
    width: 100%;
    padding: 12px 16px 12px 40px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    font-size: 16px;
    background: white;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

.text-field input:focus[b-wz7j990gt6] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.text-field .input-icon[b-wz7j990gt6] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
    font-size: 18px;
}

/* Filters Panel */
.filters-panel[b-wz7j990gt6] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    overflow: hidden;
}

.filters-grid[b-wz7j990gt6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
    width: 100%;
    overflow: hidden;
}

.filter-group[b-wz7j990gt6] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    overflow: hidden;
}

.filter-label[b-wz7j990gt6] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #495057;
}

/* Form Select - Modern Radix/shadcn style */
.form-select[b-wz7j990gt6] {
    width: 100%;
    max-width: 100%;
    padding: 10px 36px 10px 14px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 12px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    min-height: 42px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.form-select:focus[b-wz7j990gt6] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-select:hover:not(:focus):not(:disabled)[b-wz7j990gt6] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-select:disabled[b-wz7j990gt6] {
    opacity: 0.6;
    cursor: not-allowed;
    background-color: #f1f3f5;
    color: #868e96;
}

.form-select option[b-wz7j990gt6] {
    padding: 8px;
    background-color: #ffffff;
    color: #1a1a1a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.filters-actions[b-wz7j990gt6] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 12px;
    border-top: 1px solid #e9ecef;
}

.btn-text[b-wz7j990gt6] {
    background: transparent;
    border: none;
    color: #007bff;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.2s ease;
}

.btn-text:hover:not(:disabled)[b-wz7j990gt6] {
    background-color: rgba(0, 123, 255, 0.1);
}

.btn-text:disabled[b-wz7j990gt6] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Candidates Table */
/* Desktop Table Container */
.desktop-table-container[b-wz7j990gt6] {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    margin-bottom: 20px;
}

/* Data Table Styling */
[b-wz7j990gt6] .data-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    font-size: 14px;
}

[b-wz7j990gt6] .data-table thead {
    background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
}

[b-wz7j990gt6] .data-table thead tr {
    border-bottom: 2px solid #dee2e6;
}

[b-wz7j990gt6] .data-table th {
    padding: 16px;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    color: #212529;
    text-transform: none;
    letter-spacing: 0.5px;
    border-right: 1px solid #dee2e6;
    border-bottom: 2px solid #dee2e6;
}

[b-wz7j990gt6] .data-table th:last-child {
    border-right: none;
}

[b-wz7j990gt6] .data-table tbody tr {
    transition: background-color 0.2s ease;
}

[b-wz7j990gt6] .data-table tbody tr:hover {
    background-color: #f8f9fa;
}

[b-wz7j990gt6] .data-table td {
    padding: 16px;
    color: #495057;
    border-right: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
}

[b-wz7j990gt6] .data-table td:last-child {
    border-right: none;
}

.text-center[b-wz7j990gt6] {
    text-align: center;
}

/* Pagination is now handled by the Pagination component */

/* Buttons */
.btn[b-wz7j990gt6] {
    padding: 10px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn-primary[b-wz7j990gt6] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-wz7j990gt6] {
    background: #0056b3;
}

.btn-sm[b-wz7j990gt6] {
    padding: 6px 12px;
    font-size: 12px;
}

.btn:disabled[b-wz7j990gt6] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Modal Styles */
.modal-overlay[b-wz7j990gt6] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    padding: 20px;
}

.modal-container[b-wz7j990gt6] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
}

.modal-header[b-wz7j990gt6] {
    padding: 24px;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-header h3[b-wz7j990gt6] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

.modal-close[b-wz7j990gt6] {
    background: none;
    border: none;
    font-size: 28px;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.modal-close:hover[b-wz7j990gt6] {
    background: #f8f9fa;
    color: #212529;
}

.modal-body[b-wz7j990gt6] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

.modal-description[b-wz7j990gt6] {
    margin: 0 0 20px 0;
    color: #495057;
    font-size: 14px;
}

.template-options[b-wz7j990gt6] {
    margin-bottom: 24px;
}

.template-options h4[b-wz7j990gt6] {
    margin: 0 0 12px 0;
    font-size: 14px;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.template-option-btn[b-wz7j990gt6] {
    width: 100%;
    padding: 16px;
    margin-bottom: 8px;
    border: 2px solid #e9ecef;
    background: white;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    transition: all 0.2s ease;
}

.template-option-btn:hover[b-wz7j990gt6] {
    border-color: #007bff;
    background: #f8f9fa;
}

.template-name[b-wz7j990gt6] {
    font-size: 15px;
    font-weight: 600;
    color: #212529;
    margin-bottom: 4px;
}

.template-meta[b-wz7j990gt6] {
    font-size: 13px;
    color: #6c757d;
}

.divider[b-wz7j990gt6] {
    text-align: center;
    margin: 24px 0;
    position: relative;
    color: #6c757d;
    font-size: 13px;
    font-weight: 600;
}

.divider[b-wz7j990gt6]::before,
.divider[b-wz7j990gt6]::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 45%;
    height: 1px;
    background: #dee2e6;
}

.divider[b-wz7j990gt6]::before {
    left: 0;
}

.divider[b-wz7j990gt6]::after {
    right: 0;
}

.invite-option[b-wz7j990gt6] {
    text-align: center;
}

.invite-option .btn[b-wz7j990gt6] {
    width: 100%;
    max-width: 300px;
}

.invite-description[b-wz7j990gt6] {
    margin: 8px 0 0 0;
    font-size: 13px;
    color: #6c757d;
}



.btn-secondary[b-wz7j990gt6] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-wz7j990gt6] {
    background: #5a6268;
}

/* Responsive */
@media (max-width: 768px) {
    .filters-grid[b-wz7j990gt6] {
        grid-template-columns: 1fr;
    }

    .hide-mobile[b-wz7j990gt6] {
        display: none;
    }

    .desktop-table-container[b-wz7j990gt6] {
        overflow-x: auto;
    }

    .data-table[b-wz7j990gt6] {
        min-width: 600px;
    }

    .modal-container[b-wz7j990gt6] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddPositionForm.razor.rz.scp.css */
/* AddPositionForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-xdk3ykkfec] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-xdk3ykkfec] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 700px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-xdk3ykkfec] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title-content[b-xdk3ykkfec] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.modal-title-left[b-xdk3ykkfec] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.modal-icon[b-xdk3ykkfec] {
    font-size: 24px;
    color: var(--tenant-primary-color, #007bff);
}

.modal-title[b-xdk3ykkfec] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

.modal-subtitle[b-xdk3ykkfec] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #6c757d;
    margin: 0;
}

/* Modal Content */
.modal-content[b-xdk3ykkfec] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Form Layout */
.form-container[b-xdk3ykkfec] {
    padding: 0;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

.form-grid[b-xdk3ykkfec] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-xdk3ykkfec] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-xdk3ykkfec] {
    grid-column: 1 / -1;
}

.form-field.half-width[b-xdk3ykkfec] {
    grid-column: span 1;
}

/* Form Labels */
.form-label[b-xdk3ykkfec] {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
    display: block;
    letter-spacing: -0.025em;
}

/* Form Controls */
.form-input[b-xdk3ykkfec], .form-select[b-xdk3ykkfec], .form-textarea[b-xdk3ykkfec] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 14px;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 48px;
}

.form-textarea[b-xdk3ykkfec] {
    min-height: auto;
    resize: vertical;
    font-family: inherit;
}

.form-input:focus[b-xdk3ykkfec], .form-select:focus[b-xdk3ykkfec], .form-textarea:focus[b-xdk3ykkfec] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-xdk3ykkfec], .form-select:hover:not(:focus)[b-xdk3ykkfec], .form-textarea:hover:not(:focus)[b-xdk3ykkfec] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-xdk3ykkfec]::placeholder, .form-textarea[b-xdk3ykkfec]::placeholder {
    color: #6b7280;
    opacity: 1;
}

/* Select Styling */
.form-select[b-xdk3ykkfec] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 48px;
    cursor: pointer;
}

.form-select:focus[b-xdk3ykkfec] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23594ae2' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}

.form-select option[b-xdk3ykkfec] {
    padding: 12px 16px;
    background-color: #ffffff;
    color: #1a1a1a;
    font-size: 14px;
    line-height: 1.5;
    border: none;
    min-height: 44px;
}

/* Modal Actions */
.modal-actions[b-xdk3ykkfec] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Button Styles */
.btn[b-xdk3ykkfec] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn:disabled[b-xdk3ykkfec] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-cancel[b-xdk3ykkfec] {
    background: transparent;
    color: #6c757d;
    border: 1px solid #ced4da;
}

.btn-cancel:hover:not(:disabled)[b-xdk3ykkfec] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.btn-primary[b-xdk3ykkfec] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-xdk3ykkfec] {
    background: #0056b3;
}

/* Loading State */
.loading-spinner[b-xdk3ykkfec] {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-xdk3ykkfec 1s linear infinite;
    margin-right: 8px;
}

@keyframes spin-b-xdk3ykkfec {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-xdk3ykkfec] {
    margin-left: 4px;
}

/* Responsive Design */
@media (max-width: 640px) {
    .modal-dialog[b-xdk3ykkfec] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }

    .modal-content[b-xdk3ykkfec] {
        padding: 20px 16px;
    }

    .form-grid[b-xdk3ykkfec] {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .form-field.half-width[b-xdk3ykkfec] {
        grid-column: 1;
    }

    .modal-title-content[b-xdk3ykkfec] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

@media (max-width: 480px) {
    .modal-header[b-xdk3ykkfec] {
        padding: 16px 20px;
    }

    .modal-content[b-xdk3ykkfec] {
        padding: 16px;
    }

    .modal-actions[b-xdk3ykkfec] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .form-grid[b-xdk3ykkfec] {
        gap: 16px;
    }

    .form-input[b-xdk3ykkfec], .form-select[b-xdk3ykkfec], .form-textarea[b-xdk3ykkfec] {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 12px 14px;
        min-height: 44px;
    }

    .form-textarea[b-xdk3ykkfec] {
        min-height: auto;
    }
}

/* Form Validation */
.form-input.input-error[b-xdk3ykkfec], .form-select.input-error[b-xdk3ykkfec], .form-textarea.input-error[b-xdk3ykkfec] {
    border-color: #dc3545;
    background-color: #fff5f5;
}

.form-input.input-error:focus[b-xdk3ykkfec], .form-select.input-error:focus[b-xdk3ykkfec], .form-textarea.input-error:focus[b-xdk3ykkfec] {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

.field-validation-error[b-xdk3ykkfec] {
    display: block;
    color: #dc3545;
    font-size: 0.8125rem;
    margin-top: 4px;
    font-weight: 500;
}

/* Error state */
.error-message[b-xdk3ykkfec] {
    color: #dc3545;
    font-size: 12px;
    margin-top: 4px;
}

/* Success state */
.success-message[b-xdk3ykkfec] {
    color: #28a745;
    font-size: 12px;
    margin-top: 4px;
}

/* Checkbox Styles */
.form-checkbox-label[b-xdk3ykkfec] {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 12px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #f8f9fa;
    transition: all 0.2s ease;
    user-select: none;
}

.form-checkbox-label:hover[b-xdk3ykkfec] {
    background-color: #e9ecef;
    border-color: #b8bcc8;
}

.form-checkbox[b-xdk3ykkfec] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: #007bff;
}

.form-checkbox-label span[b-xdk3ykkfec] {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
}

/* Disabled select styling */
.form-select:disabled[b-xdk3ykkfec] {
    background-color: #f0f0f0;
    cursor: not-allowed;
    opacity: 0.6;
    color: #6c757d;
}

/* Searchable Dropdown Styles */
.searchable-dropdown[b-xdk3ykkfec] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 2px solid #e1e5e9;
    border-top: none;
    border-radius: 0 0 8px 8px;
    max-height: 250px;
    overflow-y: auto;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin-top: -8px;
}

.dropdown-item[b-xdk3ykkfec] {
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 14px;
    color: #1a1a1a;
    border-bottom: 1px solid #f0f0f0;
}

.dropdown-item:last-child[b-xdk3ykkfec] {
    border-bottom: none;
}

.dropdown-item:hover[b-xdk3ykkfec] {
    background-color: #f8f9fa;
    color: var(--tenant-primary-color, #007bff);
}

.dropdown-item.selected[b-xdk3ykkfec] {
    background-color: #e7f3ff;
    color: var(--tenant-primary-color, #007bff);
    font-weight: 600;
}

.form-field[b-xdk3ykkfec] {
    position: relative;
}

.selected-value[b-xdk3ykkfec] {
    margin-top: 8px;
    padding: 8px 12px;
    background-color: #e7f3ff;
    border-radius: 6px;
    font-size: 13px;
    color: var(--tenant-primary-color, #007bff);
    font-weight: 500;
    border: 1px solid rgba(89, 74, 226, 0.2);
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddQuestionForm.razor.rz.scp.css */
/* AddQuestionForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-in4piq4yy9] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-in4piq4yy9] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 700px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-in4piq4yy9] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title-container[b-in4piq4yy9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.modal-title-content[b-in4piq4yy9] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-in4piq4yy9] {
    font-size: 20px;
    color: var(--tenant-primary-color, #007bff);
}

.modal-title[b-in4piq4yy9] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

.template-name[b-in4piq4yy9] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #6c757d;
    margin: 0;
}

/* Modal Content */
.modal-content[b-in4piq4yy9] {
    padding: 0;
    overflow-y: auto;
    flex: 1;
}

/* Form Styling */
.dialog-content-wrapper[b-in4piq4yy9] {
    padding: 24px 8px;
    max-width: 100%;
    margin: 0;
}

.form-container[b-in4piq4yy9] {
    padding: 0;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

.form-grid[b-in4piq4yy9] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-in4piq4yy9] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-in4piq4yy9] {
    grid-column: 1 / -1;
}

.form-label[b-in4piq4yy9] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
    display: block;
    letter-spacing: -0.025em;
}

.form-input[b-in4piq4yy9], .form-textarea[b-in4piq4yy9] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 48px;
}

.form-textarea[b-in4piq4yy9] {
    min-height: auto;
    resize: vertical;
}

.form-input:focus[b-in4piq4yy9], .form-textarea:focus[b-in4piq4yy9] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-in4piq4yy9], .form-textarea:hover:not(:focus)[b-in4piq4yy9] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-in4piq4yy9]::placeholder, .form-textarea[b-in4piq4yy9]::placeholder {
    color: #6b7280;
    opacity: 1;
}

.field-help[b-in4piq4yy9] {
    font-size: 0.75rem;
    color: #6b7280;
    margin: 4px 0 0 0;
    line-height: 1.4;
}

/* Error States */
.form-input.error[b-in4piq4yy9] {
    border-color: #dc3545;
    background-color: #fff5f5;
}

.form-input.error:focus[b-in4piq4yy9] {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

.field-error[b-in4piq4yy9] {
    font-size: 0.75rem;
    color: #dc3545;
    margin: 4px 0 0 0;
    line-height: 1.4;
    font-weight: 500;
}

/* Questions List Section */
.questions-list-section[b-in4piq4yy9] {
    background-color: #f8f9fa;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 8px;
}

.section-header[b-in4piq4yy9] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.section-icon[b-in4piq4yy9] {
    font-size: 1.25rem;
}

.section-title[b-in4piq4yy9] {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
    letter-spacing: -0.025em;
}

.questions-list[b-in4piq4yy9] {
    max-height: 300px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.question-item[b-in4piq4yy9] {
    background-color: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 16px;
}

.question-header[b-in4piq4yy9] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.question-number[b-in4piq4yy9] {
    background-color: #594ae2;
    color: white;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    min-width: 24px;
    text-align: center;
    flex-shrink: 0;
}

.question-content[b-in4piq4yy9] {
    flex: 1;
}

.question-actions[b-in4piq4yy9] {
    margin-left: 12px;
    display: flex;
    align-items: flex-start;
}

.delete-button[b-in4piq4yy9] {
    background-color: #ef4444;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 6px 12px;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.delete-button:hover:not(:disabled)[b-in4piq4yy9] {
    background-color: #dc2626;
    transform: translateY(-1px);
}

.delete-button:disabled[b-in4piq4yy9] {
    background-color: #9ca3af;
    cursor: not-allowed;
    transform: none;
}

.protected-label[b-in4piq4yy9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    background-color: #fef3c7;
    color: #92400e;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
    white-space: nowrap;
    cursor: help;
    border: 1px solid #fbbf24;
}

.protected-label:hover[b-in4piq4yy9] {
    background-color: #fde68a;
}

.question-text[b-in4piq4yy9] {
    margin: 0 0 8px 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #374151;
}

.question-timers[b-in4piq4yy9] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.timer-item[b-in4piq4yy9] {
    font-size: 0.75rem;
    color: #6b7280;
    white-space: nowrap;
}

/* Empty State */
.empty-state[b-in4piq4yy9] {
    text-align: center;
    padding: 24px;
    background-color: #eff6ff;
    border: 1.5px solid #93c5fd;
    border-radius: 8px;
    margin-bottom: 8px;
}

.empty-message[b-in4piq4yy9] {
    color: #1e40af;
    font-size: 0.875rem;
    margin: 0;
    font-weight: 500;
}

/* Time Settings Section */
.time-settings-section[b-in4piq4yy9] {
    background-color: #f8f9fa;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
}

.time-settings-grid[b-in4piq4yy9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 16px;
}

.time-field[b-in4piq4yy9] {
    display: flex;
    flex-direction: column;
}

/* Modal Actions */
.modal-actions[b-in4piq4yy9] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Button Styles */
.btn[b-in4piq4yy9] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn:disabled[b-in4piq4yy9] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-in4piq4yy9] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-in4piq4yy9] {
    background: #5a6268;
}

.btn-primary[b-in4piq4yy9] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-in4piq4yy9] {
    background: #0056b3;
}

/* Loading Spinner */
.loading-spinner[b-in4piq4yy9] {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-in4piq4yy9 1s linear infinite;
}

@keyframes spin-b-in4piq4yy9 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-in4piq4yy9] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }

    .dialog-content-wrapper[b-in4piq4yy9] {
        padding: 20px 8px;
    }

    .form-grid[b-in4piq4yy9] {
        gap: 20px;
    }

    .time-settings-grid[b-in4piq4yy9] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .question-timers[b-in4piq4yy9] {
        justify-content: center;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        margin-top: 8px;
    }

    .timer-item[b-in4piq4yy9] {
        text-align: center;
    }
}

@media (max-width: 480px) {
    .modal-header[b-in4piq4yy9] {
        padding: 16px 20px;
    }

    .modal-actions[b-in4piq4yy9] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .dialog-content-wrapper[b-in4piq4yy9] {
        padding: 16px 8px;
    }

    .form-grid[b-in4piq4yy9] {
        gap: 16px;
    }

    .form-input[b-in4piq4yy9], .form-textarea[b-in4piq4yy9] {
        font-size: 16px;
        padding: 12px 14px;
        min-height: 44px;
    }

    .form-textarea[b-in4piq4yy9] {
        min-height: auto;
    }

    .questions-list-section[b-in4piq4yy9], .time-settings-section[b-in4piq4yy9] {
        padding: 16px;
    }

    .question-header[b-in4piq4yy9] {
        flex-direction: column;
        gap: 8px;
    }

    .question-number[b-in4piq4yy9] {
        align-self: flex-start;
    }

    .question-actions[b-in4piq4yy9] {
        margin-left: 0;
        margin-top: 8px;
        justify-content: center;
    }

    .delete-button[b-in4piq4yy9] {
        width: 100%;
        max-width: 120px;
    }

    .btn[b-in4piq4yy9] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/AddQuestionTemplateForm.razor.rz.scp.css */
/* AddQuestionTemplateForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-783jbmg2wz] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-783jbmg2wz] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 700px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-783jbmg2wz] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-783jbmg2wz] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

/* Modal Content */
.modal-content[b-783jbmg2wz] {
    padding: 0;
    overflow-y: auto;
    flex: 1;
}

/* Form Styling */
.dialog-content-wrapper[b-783jbmg2wz] {
    padding: 24px 8px;
    max-width: 100%;
    margin: 0;
}

.form-container[b-783jbmg2wz] {
    padding: 0;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

.form-grid[b-783jbmg2wz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-783jbmg2wz] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-783jbmg2wz] {
    grid-column: 1 / -1;
}

.form-field.half-width[b-783jbmg2wz] {
    grid-column: span 1;
}

.form-label[b-783jbmg2wz] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
    display: block;
    letter-spacing: -0.025em;
}

.form-input[b-783jbmg2wz], .form-select[b-783jbmg2wz], .form-textarea[b-783jbmg2wz] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 48px;
}

.form-textarea[b-783jbmg2wz] {
    min-height: auto;
    resize: vertical;
}

.form-input:focus[b-783jbmg2wz], .form-select:focus[b-783jbmg2wz], .form-textarea:focus[b-783jbmg2wz] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-783jbmg2wz], .form-select:hover:not(:focus)[b-783jbmg2wz], .form-textarea:hover:not(:focus)[b-783jbmg2wz] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-783jbmg2wz]::placeholder, .form-textarea[b-783jbmg2wz]::placeholder {
    color: #6b7280;
    opacity: 1;
}

.form-select[b-783jbmg2wz] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 48px;
    cursor: pointer;
}

.form-select:focus[b-783jbmg2wz] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23594ae2' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}

.field-help[b-783jbmg2wz] {
    font-size: 0.75rem;
    color: #6b7280;
    margin: 4px 0 0 0;
    line-height: 1.4;
}

/* Status Section */
.status-section[b-783jbmg2wz] {
    background-color: #f8f9fa;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    padding: 16px;
}

.toggle-container[b-783jbmg2wz] {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-top: 8px;
}

.toggle-input[b-783jbmg2wz] {
    display: none;
}

.toggle-slider[b-783jbmg2wz] {
    width: 48px;
    height: 24px;
    background-color: #ccc;
    border-radius: 24px;
    position: relative;
    transition: background-color 0.3s;
    margin-right: 12px;
    flex-shrink: 0;
}

.toggle-slider[b-783jbmg2wz]::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background-color: white;
    border-radius: 50%;
    transition: transform 0.3s;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.toggle-input:checked + .toggle-slider[b-783jbmg2wz] {
    background-color: #10b981;
}

.toggle-input:checked + .toggle-slider[b-783jbmg2wz]::before {
    transform: translateX(24px);
}

.toggle-label[b-783jbmg2wz] {
    font-size: 0.875rem;
    color: #374151;
    user-select: none;
    font-weight: 500;
}

/* Tags Section */
.tags-section[b-783jbmg2wz] {
    background-color: #f8f9fa;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
}

.tags-display[b-783jbmg2wz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.tag-chip[b-783jbmg2wz] {
    background-color: #594ae2;
    color: white;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
}

.tag-remove[b-783jbmg2wz] {
    background: none;
    border: none;
    color: white;
    font-size: 1rem;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    font-weight: bold;
}

.tag-remove:hover[b-783jbmg2wz] {
    opacity: 0.7;
}

.tags-empty[b-783jbmg2wz] {
    margin-bottom: 16px;
}

.empty-message[b-783jbmg2wz] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
    padding: 12px;
    background-color: #eff6ff;
    border: 1px solid #93c5fd;
    border-radius: 6px;
}

.add-tag-section[b-783jbmg2wz] {
    display: flex;
    gap: 12px;
    align-items: stretch;
}

.add-tag-section .form-input[b-783jbmg2wz] {
    flex: 1;
    margin: 0;
}

.add-tag-btn[b-783jbmg2wz] {
    background-color: #594ae2;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 14px 20px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    min-height: 48px;
}

.add-tag-btn:hover:not(:disabled)[b-783jbmg2wz] {
    background-color: #4c3dd6;
    transform: translateY(-1px);
}

.add-tag-btn:disabled[b-783jbmg2wz] {
    background-color: #d1d5db;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Modal Actions */
.modal-actions[b-783jbmg2wz] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Button Styles */
.btn[b-783jbmg2wz] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn:disabled[b-783jbmg2wz] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-783jbmg2wz] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-783jbmg2wz] {
    background: #5a6268;
}

.btn-primary[b-783jbmg2wz] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-783jbmg2wz] {
    background: #0056b3;
}

/* Loading Spinner */
.loading-spinner[b-783jbmg2wz] {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-783jbmg2wz 1s linear infinite;
}

@keyframes spin-b-783jbmg2wz {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-783jbmg2wz] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }

    .dialog-content-wrapper[b-783jbmg2wz] {
        padding: 20px 8px;
    }

    .form-grid[b-783jbmg2wz] {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .form-field.half-width[b-783jbmg2wz] {
        grid-column: 1;
    }

    .add-tag-section[b-783jbmg2wz] {
        flex-direction: column;
        gap: 8px;
    }
}

@media (max-width: 480px) {
    .modal-header[b-783jbmg2wz] {
        padding: 16px 20px;
    }

    .modal-actions[b-783jbmg2wz] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .dialog-content-wrapper[b-783jbmg2wz] {
        padding: 16px 8px;
    }

    .form-grid[b-783jbmg2wz] {
        gap: 16px;
    }

    .form-input[b-783jbmg2wz], .form-select[b-783jbmg2wz], .form-textarea[b-783jbmg2wz] {
        font-size: 16px;
        padding: 12px 14px;
        min-height: 44px;
    }

    .form-textarea[b-783jbmg2wz] {
        min-height: auto;
    }

    .tags-section[b-783jbmg2wz], .status-section[b-783jbmg2wz] {
        padding: 16px;
    }

    .btn[b-783jbmg2wz] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/CustomQuestionDialog.razor.rz.scp.css */
/* CustomQuestionDialog.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-svgob76otd] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-svgob76otd] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-svgob76otd] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-svgob76otd] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

/* Modal Content */
.modal-content[b-svgob76otd] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Form Styling */
.dialog-content-wrapper[b-svgob76otd] {
    padding: 0;
    max-width: 100%;
    margin: 0;
}

.form-container[b-svgob76otd] {
    padding: 0;
    max-width: 100%;
    margin: 0;
    width: 100%;
}

.form-grid[b-svgob76otd] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-svgob76otd] {
    display: flex;
    flex-direction: column;
}

.form-field.full-width[b-svgob76otd] {
    grid-column: 1 / -1;
}

.form-label[b-svgob76otd] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
    display: block;
    letter-spacing: -0.025em;
}

.form-input[b-svgob76otd], .form-textarea[b-svgob76otd] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 48px;
}

.form-textarea[b-svgob76otd] {
    min-height: auto;
    resize: vertical;
}

.form-input:focus[b-svgob76otd], .form-textarea:focus[b-svgob76otd] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-svgob76otd], .form-textarea:hover:not(:focus)[b-svgob76otd] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-svgob76otd]::placeholder, .form-textarea[b-svgob76otd]::placeholder {
    color: #6b7280;
    opacity: 1;
}

/* Time Settings Section */
.time-settings-section[b-svgob76otd] {
    background-color: #f8f9fa;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
}

.section-title[b-svgob76otd] {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    margin: 0 0 16px 0;
    letter-spacing: -0.025em;
}

.time-settings-grid[b-svgob76otd] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.time-field[b-svgob76otd] {
    display: flex;
    flex-direction: column;
}

.field-help[b-svgob76otd] {
    font-size: 0.75rem;
    color: #6b7280;
    margin: 4px 0 0 0;
    line-height: 1.4;
}

/* Modal Actions */
.modal-actions[b-svgob76otd] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Button Styles */
.btn[b-svgob76otd] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn:disabled[b-svgob76otd] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-svgob76otd] {
    background: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-svgob76otd] {
    background: #5a6268;
}

.btn-primary[b-svgob76otd] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-svgob76otd] {
    background: #0056b3;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-svgob76otd] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }

    .modal-content[b-svgob76otd] {
        padding: 16px;
    }

    .time-settings-grid[b-svgob76otd] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .time-settings-section[b-svgob76otd] {
        padding: 16px;
    }
}

@media (max-width: 480px) {
    .modal-header[b-svgob76otd] {
        padding: 16px 20px;
    }

    .modal-actions[b-svgob76otd] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .form-grid[b-svgob76otd] {
        gap: 16px;
    }

    .form-input[b-svgob76otd], .form-textarea[b-svgob76otd] {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 12px 14px;
        min-height: 44px;
    }

    .form-textarea[b-svgob76otd] {
        min-height: auto;
    }

    .btn[b-svgob76otd] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/EditClientForm.razor.rz.scp.css */
/* EditClientForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-w1iyz0cndz] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
    overflow-y: auto;
}

/* Modal Container */
.modal-container[b-w1iyz0cndz] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    margin-top: 10vh;
    animation: modalSlideIn-b-w1iyz0cndz 0.3s ease-out;
}

@keyframes modalSlideIn-b-w1iyz0cndz {
    from {
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Modal Content */
.modal-content[b-w1iyz0cndz] {
    padding: 24px;
}

.modal-header[b-w1iyz0cndz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.modal-title h5[b-w1iyz0cndz] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
}

.close-btn[b-w1iyz0cndz] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s;
    line-height: 1;
}

.close-btn:hover[b-w1iyz0cndz] {
    background: #f3f4f6;
    color: #374151;
}

.modal-divider[b-w1iyz0cndz] {
    border: none;
    height: 1px;
    background: #e5e7eb;
    margin: 16px 0 24px 0;
}

/* Loading State */
.loading-container[b-w1iyz0cndz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
    gap: 16px;
}

.loading-spinner[b-w1iyz0cndz] {
    width: 40px;
    height: 40px;
    border: 3px solid #e1e5e9;
    border-top: 3px solid #594ae2;
    border-radius: 50%;
    animation: spin-b-w1iyz0cndz 1s linear infinite;
}

.loading-text[b-w1iyz0cndz] {
    color: #6b7280;
    font-size: 0.875rem;
}

/* Form Styling */
.form-container[b-w1iyz0cndz] {
    width: 100%;
}

.form-grid[b-w1iyz0cndz] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    width: 100%;
}

.form-field[b-w1iyz0cndz] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-field.half-width[b-w1iyz0cndz] {
    grid-column: 1;
}

.form-field.full-width[b-w1iyz0cndz] {
    grid-column: 1;
}

.form-label[b-w1iyz0cndz] {
    font-weight: 500;
    font-size: 0.875rem;
    color: #374151;
    margin-bottom: 4px;
}

.form-input[b-w1iyz0cndz] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    font-weight: 400;
    min-height: 48px;
}

.form-input:focus[b-w1iyz0cndz] {
    outline: none;
    border-color: #594ae2;
    box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1);
    background-color: #ffffff;
}

.form-input:hover:not(:focus)[b-w1iyz0cndz] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-w1iyz0cndz]::placeholder {
    color: #6b7280;
    opacity: 1;
}

/* Toggle Switch */
.toggle-container[b-w1iyz0cndz] {
    display: flex;
    align-items: center;
    margin: 8px 0;
}

.toggle-checkbox[b-w1iyz0cndz] {
    display: none;
}

.toggle-label[b-w1iyz0cndz] {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 12px;
    font-size: 0.875rem;
    color: #374151;
}

.toggle-slider[b-w1iyz0cndz] {
    position: relative;
    width: 44px;
    height: 24px;
    background-color: #d1d5db;
    border-radius: 12px;
    transition: background-color 0.2s;
}

.toggle-slider[b-w1iyz0cndz]::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background-color: white;
    border-radius: 50%;
    transition: transform 0.2s;
}

.toggle-checkbox:checked + .toggle-label .toggle-slider[b-w1iyz0cndz] {
    background-color: #594ae2;
}

.toggle-checkbox:checked + .toggle-label .toggle-slider[b-w1iyz0cndz]::before {
    transform: translateX(20px);
}

.form-divider[b-w1iyz0cndz] {
    border: none;
    height: 1px;
    background: #e5e7eb;
    margin: 24px 0;
}

/* Modal Actions */
.modal-actions[b-w1iyz0cndz] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 24px;
}

/* Button Styles */
.btn-cancel[b-w1iyz0cndz], .btn-primary[b-w1iyz0cndz] {
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid;
    display: flex;
    align-items: center;
    gap: 8px;
}

.btn-cancel[b-w1iyz0cndz] {
    background: #ffffff;
    border-color: #d1d5db;
    color: #374151;
}

.btn-cancel:hover[b-w1iyz0cndz] {
    background: #f9fafb;
    border-color: #9ca3af;
}

.btn-primary[b-w1iyz0cndz] {
    background: #594ae2;
    border-color: #594ae2;
    color: #ffffff;
}

.btn-primary:hover:not(:disabled)[b-w1iyz0cndz] {
    background: #4c3db8;
    border-color: #4c3db8;
}

.btn-primary:disabled[b-w1iyz0cndz] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-loading[b-w1iyz0cndz] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.loading-spinner-small[b-w1iyz0cndz] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid #ffffff;
    border-radius: 50%;
    animation: spin-b-w1iyz0cndz 1s linear infinite;
}

@keyframes spin-b-w1iyz0cndz {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive Design */
@media (min-width: 768px) {
    .form-grid[b-w1iyz0cndz] {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }

    .form-field.full-width[b-w1iyz0cndz] {
        grid-column: 1 / -1;
    }

    .modal-container[b-w1iyz0cndz] {
        margin-top: 5vh;
    }
}

@media (max-width: 767px) {
    .modal-overlay[b-w1iyz0cndz] {
        padding: 10px;
    }

    .modal-container[b-w1iyz0cndz] {
        margin-top: 5vh;
        max-height: 95vh;
    }

    .modal-content[b-w1iyz0cndz] {
        padding: 16px;
    }

    .modal-actions[b-w1iyz0cndz] {
        flex-direction: column;
    }

    .btn-cancel[b-w1iyz0cndz], .btn-primary[b-w1iyz0cndz] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/EditEmployeeForm.razor.rz.scp.css */
/* EditEmployeeForm.razor.css - Blazor CSS Isolation */

/* Reuse styles from AddEmployeeForm for visual consistency */
.modal-overlay[b-6o8yr33bua] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

.modal-dialog[b-6o8yr33bua] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.modal-header[b-6o8yr33bua] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-6o8yr33bua] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

.status-text[b-6o8yr33bua] {
    margin-left: 8px;
    font-size: 0.95rem;
    color: #6c757d;
    font-weight: 500;
}

.modal-content[b-6o8yr33bua] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

.dialog-content-wrapper[b-6o8yr33bua] { padding: 0; max-width: 100%; margin: 0; }
.form-container[b-6o8yr33bua] { padding: 0; max-width: 100%; margin: 0; width: 100%; }

.form-grid[b-6o8yr33bua] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form-field[b-6o8yr33bua] { display: flex; flex-direction: column; }
.form-field.full-width[b-6o8yr33bua] { grid-column: 1 / -1; }
.form-field.half-width[b-6o8yr33bua] { grid-column: span 1; }

.form-label[b-6o8yr33bua] { font-size: 0.875rem; font-weight: 600; color: #374151; margin-bottom: 6px; }

.form-input[b-6o8yr33bua], .form-select[b-6o8yr33bua] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    font-family: inherit;
    min-height: 48px;
}
.form-input:focus[b-6o8yr33bua], .form-select:focus[b-6o8yr33bua] { outline: none; border-color: #594ae2; box-shadow: 0 0 0 3px rgba(89, 74, 226, 0.1); }
.form-input:hover:not(:focus)[b-6o8yr33bua], .form-select:hover:not(:focus)[b-6o8yr33bua] { border-color: #b8bcc8; background-color: #f8f9fa; }

.form-select[b-6o8yr33bua] { appearance: none; background-position: right 16px center; background-repeat: no-repeat; padding-right: 48px; cursor: pointer; border-radius: 8px; }

/* Switch Styling */
.switch-container[b-6o8yr33bua] { display: flex; align-items: center; cursor: pointer; margin: 16px 0; }
.switch-input[b-6o8yr33bua] { display: none; }
.switch-slider[b-6o8yr33bua] { width: 52px; height: 28px; background-color: #ccc; border-radius: 28px; position: relative; transition: background-color 0.3s; margin-right: 12px; }
.switch-slider[b-6o8yr33bua]::before { content: ''; position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; background-color: white; border-radius: 50%; transition: transform 0.3s; box-shadow: 0 2px 4px rgba(0,0,0,0.2); }
.switch-input:checked + .switch-slider[b-6o8yr33bua] { background-color: #594ae2; }
.switch-input:checked + .switch-slider[b-6o8yr33bua]::before { transform: translateX(24px); }
.switch-label[b-6o8yr33bua] { font-size: 1rem; color: #374151; user-select: none; }

/* Modal Actions */
.modal-actions[b-6o8yr33bua] { padding: 16px 24px; border-top: 1px solid #e9ecef; background: #f8f9fa; display: flex; justify-content: flex-end; gap: 12px; }

/* Buttons */
.btn[b-6o8yr33bua] { padding: 10px 20px; border: none; border-radius: 6px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s ease; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; }
.btn:disabled[b-6o8yr33bua] { opacity: 0.6; cursor: not-allowed; }
.btn-secondary[b-6o8yr33bua] { background: #6c757d; color: #fff; }
.btn-secondary:hover:not(:disabled)[b-6o8yr33bua] { background: #5a6268; }
.btn-primary[b-6o8yr33bua] { background: #007bff; color: #fff; }
.btn-primary:hover:not(:disabled)[b-6o8yr33bua] { background: #0056b3; }

/* Spinner */
.loading-spinner[b-6o8yr33bua] { width: 16px; height: 16px; border: 2px solid transparent; border-top: 2px solid currentColor; border-radius: 50%; animation: spin-b-6o8yr33bua 1s linear infinite; }
@keyframes spin-b-6o8yr33bua { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

/* Responsive */
@media (max-width: 768px) {
  .modal-dialog[b-6o8yr33bua] { margin: 8px; max-width: calc(100vw - 16px); }
  .modal-content[b-6o8yr33bua] { padding: 16px; }
  .form-grid[b-6o8yr33bua] { grid-template-columns: 1fr; gap: 18px; }
  .form-field.half-width[b-6o8yr33bua] { grid-column: 1; }
}
@media (max-width: 480px) {
  .modal-header[b-6o8yr33bua] { padding: 16px 20px; }
  .modal-actions[b-6o8yr33bua] { padding: 12px 20px; flex-direction: column; }
  .form-grid[b-6o8yr33bua] { gap: 16px; }
  .form-input[b-6o8yr33bua], .form-select[b-6o8yr33bua] { font-size: 16px; padding: 12px 14px; min-height: 44px; }
  .btn[b-6o8yr33bua] { width: 100%; justify-content: center; }
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/EditPositionForm.razor.rz.scp.css */
/* EditPositionForm.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-efemgcoj9o] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-efemgcoj9o] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 700px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Container (legacy) */
.modal-container[b-efemgcoj9o] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 600px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-efemgcoj9o] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.modal-title-content[b-efemgcoj9o] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.modal-title-left[b-efemgcoj9o] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.modal-icon[b-efemgcoj9o] {
    font-size: 20px;
    color: var(--tenant-primary-color, #007bff);
}

.modal-title[b-efemgcoj9o] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

.modal-header h2[b-efemgcoj9o] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

.modal-close[b-efemgcoj9o] {
    background: none;
    border: none;
    font-size: 28px;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.modal-close:hover[b-efemgcoj9o] {
    background: #e9ecef;
    color: #212529;
}

/* Modal Content */
.modal-content[b-efemgcoj9o] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
    max-height: calc(90vh - 150px);
}

/* Modal Body (legacy) */
.modal-body[b-efemgcoj9o] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Form Container */
.form-container[b-efemgcoj9o] {
    width: 100%;
}

/* Form Grid */
.form-grid[b-efemgcoj9o] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

/* Form Field */
.form-field[b-efemgcoj9o] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-field.full-width[b-efemgcoj9o] {
    grid-column: 1 / -1;
}

.form-field.half-width[b-efemgcoj9o] {
    grid-column: span 1;
}

/* Form Label */
.form-label[b-efemgcoj9o] {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0;
}

/* Form Input */
.form-input[b-efemgcoj9o],
.form-textarea[b-efemgcoj9o],
.form-select[b-efemgcoj9o] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 14px;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s ease;
    box-sizing: border-box;
    font-family: inherit;
}

.form-textarea[b-efemgcoj9o] {
    resize: vertical;
    min-height: 100px;
}

.form-input:focus[b-efemgcoj9o],
.form-textarea:focus[b-efemgcoj9o],
.form-select:focus[b-efemgcoj9o] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-input:hover:not(:focus)[b-efemgcoj9o],
.form-textarea:hover:not(:focus)[b-efemgcoj9o],
.form-select:hover:not(:focus)[b-efemgcoj9o] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-input[b-efemgcoj9o]::placeholder,
.form-textarea[b-efemgcoj9o]::placeholder {
    color: #6b7280;
}

/* Select Styling */
.form-select[b-efemgcoj9o] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 48px;
    cursor: pointer;
}

.form-select:disabled[b-efemgcoj9o] {
    background-color: #f8f9fa;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Form Groups */
.form-group[b-efemgcoj9o] {
    margin-bottom: 20px;
}

.form-group:last-child[b-efemgcoj9o] {
    margin-bottom: 0;
}

.form-group label[b-efemgcoj9o] {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
    display: block;
}

/* Form Controls */
.form-control[b-efemgcoj9o] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    font-size: 14px;
    line-height: 1.5;
    color: #1a1a1a;
    transition: all 0.2s ease;
    box-sizing: border-box;
    font-family: inherit;
}

textarea.form-control[b-efemgcoj9o] {
    resize: vertical;
    min-height: 100px;
}

.form-control:focus[b-efemgcoj9o] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-control:hover:not(:focus)[b-efemgcoj9o] {
    border-color: #b8bcc8;
    background-color: #f8f9fa;
}

.form-control[b-efemgcoj9o]::placeholder {
    color: #6b7280;
}

/* Select Styling */
select.form-control[b-efemgcoj9o] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    padding-right: 48px;
    cursor: pointer;
}

/* Modal Actions */
.modal-actions[b-efemgcoj9o] {
    padding: 20px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Modal Footer (legacy) */
.modal-footer[b-efemgcoj9o] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

/* Buttons */
.btn[b-efemgcoj9o] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
}

.btn:disabled[b-efemgcoj9o] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-cancel[b-efemgcoj9o],
.btn-secondary[b-efemgcoj9o] {
    background: transparent;
    color: #6c757d;
    border: 1px solid #ced4da;
}

.btn-cancel:hover:not(:disabled)[b-efemgcoj9o],
.btn-secondary:hover:not(:disabled)[b-efemgcoj9o] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.btn-primary[b-efemgcoj9o] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-efemgcoj9o] {
    background: #0056b3;
}

/* Checkbox Styles */
.checkbox-label[b-efemgcoj9o] {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    padding: 14px 16px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    background-color: #ffffff;
    transition: all 0.2s ease;
    user-select: none;
    margin-bottom: 0;
    font-weight: normal;
}

.checkbox-label:hover[b-efemgcoj9o] {
    background-color: #f8f9fa;
    border-color: #b8bcc8;
}

.form-checkbox[b-efemgcoj9o] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: #007bff;
    margin: 0;
}

.checkbox-label span[b-efemgcoj9o] {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
}

.form-text[b-efemgcoj9o] {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: #6b7280;
}

/* Status Toggle Container */
.status-toggle-container[b-efemgcoj9o] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .form-grid[b-efemgcoj9o] {
        grid-template-columns: 1fr;
    }

    .form-field.half-width[b-efemgcoj9o] {
        grid-column: span 1;
    }
}

@media (max-width: 640px) {
    .modal-dialog[b-efemgcoj9o],
    .modal-container[b-efemgcoj9o] {
        max-width: calc(100vw - 16px);
        margin: 8px;
    }

    .modal-content[b-efemgcoj9o],
    .modal-body[b-efemgcoj9o] {
        padding: 20px 16px;
    }

    .modal-header[b-efemgcoj9o] {
        padding: 16px 20px;
    }

    .modal-actions[b-efemgcoj9o],
    .modal-footer[b-efemgcoj9o] {
        padding: 12px 20px;
        flex-direction: column;
    }

    .btn[b-efemgcoj9o] {
        width: 100%;
    }

    .form-control[b-efemgcoj9o],
    .form-input[b-efemgcoj9o],
    .form-textarea[b-efemgcoj9o],
    .form-select[b-efemgcoj9o] {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 12px 14px;
    }
}

/* Searchable Dropdown Styles */
.searchable-dropdown[b-efemgcoj9o] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 2px solid #e1e5e9;
    border-top: none;
    border-radius: 0 0 8px 8px;
    max-height: 250px;
    overflow-y: auto;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin-top: -8px;
}

.dropdown-item[b-efemgcoj9o] {
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 14px;
    color: #1a1a1a;
    border-bottom: 1px solid #f0f0f0;
}

.dropdown-item:last-child[b-efemgcoj9o] {
    border-bottom: none;
}

.dropdown-item:hover[b-efemgcoj9o] {
    background-color: #f8f9fa;
    color: var(--tenant-primary-color, #007bff);
}

.dropdown-item.selected[b-efemgcoj9o] {
    background-color: #e7f3ff;
    color: var(--tenant-primary-color, #007bff);
    font-weight: 600;
}

.form-field[b-efemgcoj9o] {
    position: relative;
}

.selected-value[b-efemgcoj9o] {
    margin-top: 8px;
    padding: 8px 12px;
    background-color: #e7f3ff;
    border-radius: 6px;
    font-size: 13px;
    color: var(--tenant-primary-color, #007bff);
    font-weight: 500;
    border: 1px solid rgba(89, 74, 226, 0.2);
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/ManageTemplateQuestions.razor.rz.scp.css */
/* Simple Modal Overlay */
.modal-overlay[b-kuweccq9gz] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 2rem;
}

/* Clean Modal Dialog */
.modal-dialog[b-kuweccq9gz] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 900px;
    max-height: 80vh;
    overflow: hidden;
}

/* Wider modal for manage template questions */
.manage-template-dialog[b-kuweccq9gz] {
    max-width: 900px;
}

/* Simple Header */
.modal-header[b-kuweccq9gz] {
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}

.modal-title[b-kuweccq9gz] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

.modal-subtitle[b-kuweccq9gz] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0.5rem 0 0 0;
    font-weight: 500;
}

/* Clean Content */
.modal-content[b-kuweccq9gz] {
    padding: 1.5rem;
    max-height: 60vh;
    overflow-y: auto;
}

/* Simple Actions */
.modal-actions[b-kuweccq9gz] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
}

/* Simplified Content Styles */
.questions-management-container[b-kuweccq9gz] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.add-question-section[b-kuweccq9gz] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 1rem;
}

.section-title[b-kuweccq9gz] {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    margin: 0 0 0.75rem 0;
}

.form-group[b-kuweccq9gz] {
    margin-bottom: 0.75rem;
}

.form-label[b-kuweccq9gz] {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.25rem;
}

.form-textarea[b-kuweccq9gz] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    resize: vertical;
    min-height: 60px;
}

.form-textarea:focus[b-kuweccq9gz] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
}

.form-row[b-kuweccq9gz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.form-input[b-kuweccq9gz] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.form-input:focus[b-kuweccq9gz] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
}

.form-actions[b-kuweccq9gz] {
    margin-top: 0.75rem;
    display: flex;
    justify-content: flex-end;
}

.questions-list-section[b-kuweccq9gz] {
    border-top: 1px solid #e5e7eb;
    padding-top: 1rem;
}

.questions-list[b-kuweccq9gz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.question-item[b-kuweccq9gz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
}

.question-content[b-kuweccq9gz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
}

.question-order[b-kuweccq9gz] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    background-color: #3b82f6;
    color: white;
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 600;
    flex-shrink: 0;
}

.question-text[b-kuweccq9gz] {
    flex: 1;
    font-size: 0.875rem;
    color: #374151;
    line-height: 1.4;
}

.question-timers[b-kuweccq9gz] {
    display: flex;
    gap: 0.75rem;
    flex-shrink: 0;
}

.timer-badge[b-kuweccq9gz] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.375rem;
    background-color: #f3f4f6;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    color: #6b7280;
}

.timer-badge.reading[b-kuweccq9gz] {
    background-color: #dbeafe;
    color: #1e40af;
}

.timer-badge.answering[b-kuweccq9gz] {
    background-color: #dcfce7;
    color: #166534;
}

.question-actions[b-kuweccq9gz] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
    margin-left: 1rem;
}

.empty-state[b-kuweccq9gz] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6b7280;
}

.empty-state-icon[b-kuweccq9gz] {
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

.empty-state-text[b-kuweccq9gz] {
    font-size: 0.875rem;
    font-weight: 500;
    margin: 0 0 0.25rem 0;
}

.empty-state-subtext[b-kuweccq9gz] {
    font-size: 0.75rem;
    margin: 0;
}

.loading-container[b-kuweccq9gz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.loading-spinner[b-kuweccq9gz] {
    width: 1.5rem;
    height: 1.5rem;
    border: 2px solid #e5e7eb;
    border-top: 2px solid #3b82f6;
    border-radius: 50%;
    animation: spin-b-kuweccq9gz 1s linear infinite;
    margin-bottom: 0.75rem;
}

.loading-text[b-kuweccq9gz] {
    color: #6b7280;
    font-size: 0.875rem;
}

@keyframes spin-b-kuweccq9gz {
    to {
        transform: rotate(360deg);
    }
}

/* Simple Button Styles */
.btn[b-kuweccq9gz] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn:disabled[b-kuweccq9gz] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary[b-kuweccq9gz] {
    background-color: #3b82f6;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-kuweccq9gz] {
    background-color: #2563eb;
}

.btn-danger[b-kuweccq9gz] {
    background-color: #ef4444;
    color: white;
}

.btn-danger:hover:not(:disabled)[b-kuweccq9gz] {
    background-color: #dc2626;
}

.btn-secondary[b-kuweccq9gz] {
    background-color: #6b7280;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-kuweccq9gz] {
    background-color: #4b5563;
}

.btn-sm[b-kuweccq9gz] {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
}

.btn-spinner[b-kuweccq9gz] {
    width: 0.875rem;
    height: 0.875rem;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-kuweccq9gz 1s linear infinite;
}
/* _content/Hirelab-frontend/Components/Pages/Employee/UI/ViewAllQuestionsDialog.razor.rz.scp.css */
/* ViewAllQuestionsDialog.razor.css - Blazor CSS Isolation */

/* Modal Overlay */
.modal-overlay[b-z4d7h309zv] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

/* Modal Dialog */
.modal-dialog[b-z4d7h309zv] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: 100%;
    max-width: 800px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.modal-header[b-z4d7h309zv] {
    padding: 20px 24px;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.modal-title[b-z4d7h309zv] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.modal-icon[b-z4d7h309zv] {
    font-size: 20px;
    color: var(--tenant-primary-color, #007bff);
}

/* Modal Content */
.modal-content[b-z4d7h309zv] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Loading State */
.loading-container[b-z4d7h309zv] {
    padding: 40px 20px;
    text-align: center;
}

.loading-bar[b-z4d7h309zv] {
    width: 100%;
    height: 4px;
    background: #e9ecef;
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 16px;
}

.loading-progress[b-z4d7h309zv] {
    height: 100%;
    background: linear-gradient(90deg, #007bff, #0056b3, #007bff);
    background-size: 200% 100%;
    animation: loading-b-z4d7h309zv 1.5s infinite;
}

@keyframes loading-b-z4d7h309zv {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.loading-text[b-z4d7h309zv] {
    font-size: 14px;
    color: #6c757d;
}

/* Questions Container */
.questions-container[b-z4d7h309zv] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Question Section */
.question-section[b-z4d7h309zv] {
    margin-bottom: 24px;
}

.section-title[b-z4d7h309zv] {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.section-title.custom[b-z4d7h309zv] {
    color: #ffc107;
}

.section-title.template[b-z4d7h309zv] {
    color: #007bff;
}

.section-icon[b-z4d7h309zv] {
    font-size: 16px;
}

/* Question Cards */
.questions-list[b-z4d7h309zv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.question-card[b-z4d7h309zv] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    padding: 16px;
    border-left: 4px solid;
}

.question-card.custom[b-z4d7h309zv] {
    border-left-color: #ffc107;
}

.question-card.template[b-z4d7h309zv] {
    border-left-color: #007bff;
    border-left-style: dashed;
}

.question-content[b-z4d7h309zv] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 16px;
    align-items: start;
}

.question-text[b-z4d7h309zv] {
    font-size: 14px;
    line-height: 1.5;
    color: #212529;
    margin: 0;
}

.question-timers[b-z4d7h309zv] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 12px;
}

/* Timer Badges */
.timer-badge[b-z4d7h309zv] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    min-width: 110px;
    justify-content: flex-start;
    white-space: nowrap;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.timer-badge.reading[b-z4d7h309zv] {
    background: #eff6ff;
    color: #1e40af;
    border: 1px solid #bfdbfe;
}

.timer-badge.answering[b-z4d7h309zv] {
    background: #f0fdf4;
    color: #059669;
    border: 1px solid #bbf7d0;
}

.timer-icon[b-z4d7h309zv] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    opacity: 0.9;
}

.timer-value[b-z4d7h309zv] {
    font-weight: 700;
    font-size: 14px;
}

/* Empty State */
.empty-state[b-z4d7h309zv] {
    padding: 40px 20px;
    text-align: center;
    background: #e3f2fd;
    border-radius: 8px;
    border: 1px solid #bbdefb;
}

.empty-state-icon[b-z4d7h309zv] {
    font-size: 48px;
    color: #1976d2;
    margin-bottom: 12px;
}

.empty-state-text[b-z4d7h309zv] {
    font-size: 14px;
    color: #1976d2;
    margin: 0;
}

/* Modal Actions */
.modal-actions[b-z4d7h309zv] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    display: flex;
    justify-content: flex-end;
}

/* Button Styles */
.btn[b-z4d7h309zv] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-transform: none;
    min-height: 40px;
}

.btn-primary[b-z4d7h309zv] {
    background: #007bff;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-z4d7h309zv] {
    background: #0056b3;
}

.btn-danger[b-z4d7h309zv] {
    background: #dc3545;
    color: white;
}

.btn-danger:hover:not(:disabled)[b-z4d7h309zv] {
    background: #c82333;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-dialog[b-z4d7h309zv] {
        margin: 8px;
        max-width: calc(100vw - 16px);
    }

    .modal-content[b-z4d7h309zv] {
        padding: 16px;
    }

    .question-content[b-z4d7h309zv] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .question-timers[b-z4d7h309zv] {
        justify-content: center;
        margin-top: 8px;
        gap: 12px;
    }
}

@media (max-width: 480px) {
    .modal-header[b-z4d7h309zv] {
        padding: 16px 20px;
    }

    .modal-actions[b-z4d7h309zv] {
        padding: 12px 20px;
    }

    .questions-container[b-z4d7h309zv] {
        gap: 16px;
    }

    .question-card[b-z4d7h309zv] {
        padding: 12px;
    }

    .timer-badge[b-z4d7h309zv] {
        font-size: 10px;
        padding: 6px 10px;
        min-width: 90px;
        gap: 6px;
    }

    .timer-icon[b-z4d7h309zv] {
        font-size: 9px;
    }

    .timer-value[b-z4d7h309zv] {
        font-size: 11px;
    }
}

@media (max-width: 600px) {
    .question-timers[b-z4d7h309zv] {
        justify-content: center;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }

    .timer-badge[b-z4d7h309zv] {
        margin: 0;
        min-width: 100px;
        flex: 1;
        max-width: 120px;
    }
}
/* _content/Hirelab-frontend/Components/Pages/EmployeeLogin.razor.rz.scp.css */
/* Employee Login Page Styles */
.employee-login-container[b-6byo8wtfmp] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    /* Use tenant gradient if available, otherwise use default gradient */
    background: var(--tenant-primary-color, linear-gradient(135deg, #667eea 0%, #764ba2 100%));
    margin: 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
}

.employee-login-card[b-6byo8wtfmp] {
    max-width: 28rem;
    width: 100%;
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    padding: 2.5rem;
    border: 1px solid #e5e7eb;
    box-sizing: border-box;
}

.login-header[b-6byo8wtfmp] {
    text-align: center;
    margin-bottom: 2rem;
}

.logo-area[b-6byo8wtfmp] {
    width: 4rem;
    height: 4rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.25rem;
}

.logo-area i[b-6byo8wtfmp] {
    font-size: 1.75rem;
    color: white;
}

.login-header h1[b-6byo8wtfmp] {
    font-size: 1.875rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
    color: #111827;
}

.subtitle[b-6byo8wtfmp] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
    line-height: 1.5;
}

/* Error Message */
.error-message[b-6byo8wtfmp] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 0.375rem;
    padding: 0.875rem 1rem;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.error-message i[b-6byo8wtfmp] {
    color: #dc2626;
    font-size: 1.125rem;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.error-message span[b-6byo8wtfmp] {
    color: #991b1b;
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Info Message */
.info-message[b-6byo8wtfmp] {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 0.375rem;
    padding: 0.875rem 1rem;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.info-message i[b-6byo8wtfmp] {
    color: #2563eb;
    font-size: 1.125rem;
    flex-shrink: 0;
}

.info-message span[b-6byo8wtfmp] {
    color: #1e40af;
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Login Content */
.login-content[b-6byo8wtfmp] {
    margin-bottom: 0;
}

/* Microsoft Button */
.ms-button[b-6byo8wtfmp] {
    width: 100%;
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    padding: 0.875rem 1rem;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #374151;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    box-sizing: border-box;
}

.ms-button:hover:not(:disabled)[b-6byo8wtfmp] {
    background: #f9fafb;
    border-color: #9ca3af;
}

.ms-button:active:not(:disabled)[b-6byo8wtfmp] {
    background: #f3f4f6;
}

.ms-button:disabled[b-6byo8wtfmp] {
    opacity: 0.6;
    cursor: not-allowed;
}

.ms-icon[b-6byo8wtfmp] {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

.loading-spinner[b-6byo8wtfmp] {
    width: 1.125rem;
    height: 1.125rem;
    border: 2px solid #e5e7eb;
    border-top-color: #667eea;
    border-radius: 50%;
    animation: spin-b-6byo8wtfmp 0.6s linear infinite;
}

@keyframes spin-b-6byo8wtfmp {
    to { transform: rotate(360deg); }
}

/* Divider */
.divider-line[b-6byo8wtfmp] {
    display: flex;
    align-items: center;
    margin: 1.75rem 0;
    color: #9ca3af;
    font-size: 0.875rem;
}

.divider-line[b-6byo8wtfmp]::before,
.divider-line[b-6byo8wtfmp]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.divider-line span[b-6byo8wtfmp] {
    padding: 0 1rem;
    text-transform: lowercase;
}

/* Back Link */
.back-link[b-6byo8wtfmp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #667eea;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    padding: 0.625rem 1rem;
    border-radius: 0.375rem;
    transition: all 0.15s ease-in-out;
}

.back-link:hover[b-6byo8wtfmp] {
    background: #f5f3ff;
    color: #5b21b6;
}

.back-link i[b-6byo8wtfmp] {
    font-size: 0.875rem;
}

/* Footer Note */
.footer-note[b-6byo8wtfmp] {
    text-align: center;
    padding-top: 1.5rem;
    margin-top: 1.5rem;
    border-top: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #9ca3af;
    font-size: 0.8125rem;
}

.footer-note i[b-6byo8wtfmp] {
    font-size: 0.875rem;
}

/* Responsive */
@media (max-width: 640px) {
    .employee-login-container[b-6byo8wtfmp] {
        padding: 0.75rem;
    }

    .employee-login-card[b-6byo8wtfmp] {
        padding: 2rem 1.5rem;
    }

    .login-header h1[b-6byo8wtfmp] {
        font-size: 1.5rem;
    }

    .ms-button[b-6byo8wtfmp] {
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
    }
}
/* _content/Hirelab-frontend/Components/Pages/ForgotPassword.razor.rz.scp.css */
/* Progress Steps */
.progress-steps[b-tmxvwa2vf8] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1.5rem 0;
}

.progress-step[b-tmxvwa2vf8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.progress-step-circle[b-tmxvwa2vf8] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background-color: #e5e7eb;
    color: #9ca3af;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.875rem;
    transition: all 0.3s ease;
}

.progress-step.active .progress-step-circle[b-tmxvwa2vf8] {
    background-color: var(--primary-color, #667eea);
    color: white;
}

.progress-step-label[b-tmxvwa2vf8] {
    font-size: 0.75rem;
    color: #6b7280;
    font-weight: 500;
}

.progress-step.active .progress-step-label[b-tmxvwa2vf8] {
    color: var(--primary-color, #667eea);
    font-weight: 600;
}

.progress-step-line[b-tmxvwa2vf8] {
    width: 3rem;
    height: 2px;
    background-color: #e5e7eb;
    margin: 0 0.5rem;
    margin-bottom: 1.5rem;
    transition: all 0.3s ease;
}

.progress-step-line.active[b-tmxvwa2vf8] {
    background-color: var(--primary-color, #667eea);
}

/* OTP Input */
.otp-input[b-tmxvwa2vf8] {
    text-align: center;
    font-size: 1.5rem;
    letter-spacing: 0.5rem;
    font-weight: 600;
}

/* Form Hint */
.form-hint[b-tmxvwa2vf8] {
    font-size: 0.75rem;
    color: #6b7280;
    margin-top: 0.5rem;
    margin-bottom: 0;
}

/* Expiry Timer */
.expiry-timer[b-tmxvwa2vf8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #fef3c7;
    border: 1px solid #fbbf24;
    border-radius: 0.375rem;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    color: #92400e;
}

.timer-icon[b-tmxvwa2vf8] {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

/* Secondary Button */
.secondary-button[b-tmxvwa2vf8] {
    width: 100%;
    padding: 0.75rem 1.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    background-color: white;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    margin-top: 0.75rem;
}

.secondary-button:hover:not(:disabled)[b-tmxvwa2vf8] {
    background-color: #f9fafb;
    border-color: #9ca3af;
}

.secondary-button:disabled[b-tmxvwa2vf8] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Back Icon */
.back-icon[b-tmxvwa2vf8] {
    width: 1rem;
    height: 1rem;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.5rem;
}

.login-options .login-link[b-tmxvwa2vf8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

/* Responsive Design */
@media (max-width: 640px) {
    .progress-step-line[b-tmxvwa2vf8] {
        width: 2rem;
    }

    .progress-step-circle[b-tmxvwa2vf8] {
        width: 2rem;
        height: 2rem;
        font-size: 0.75rem;
    }

    .progress-step-label[b-tmxvwa2vf8] {
        font-size: 0.625rem;
    }

    .otp-input[b-tmxvwa2vf8] {
        font-size: 1.25rem;
        letter-spacing: 0.3rem;
    }
}

/* Alert Improvements for this page */
.alert[b-tmxvwa2vf8] {
    animation: slideDown-b-tmxvwa2vf8 0.3s ease-out;
}

@keyframes slideDown-b-tmxvwa2vf8 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Password Strength Meter */
.password-strength-container[b-tmxvwa2vf8] {
    margin-top: 8px;
    margin-bottom: 12px;
}

.password-strength-bar[b-tmxvwa2vf8] {
    width: 100%;
    height: 6px;
    background-color: #e5e7eb;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 6px;
}

.password-strength-fill[b-tmxvwa2vf8] {
    height: 100%;
    transition: all 0.3s ease;
    border-radius: 3px;
}

.password-strength-label[b-tmxvwa2vf8] {
    display: block;
    font-size: 13px;
    font-weight: 500;
    text-align: right;
}

/* Password Requirements Checklist */
.password-requirements[b-tmxvwa2vf8] {
    margin-top: 12px;
    padding: 12px;
    background-color: #f9fafb;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
}

.requirement[b-tmxvwa2vf8] {
    display: flex;
    align-items: center;
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 6px;
    transition: all 0.2s ease;
}

.requirement:last-child[b-tmxvwa2vf8] {
    margin-bottom: 0;
}

.requirement.valid[b-tmxvwa2vf8] {
    color: #10b981;
    font-weight: 500;
}

.requirement-icon[b-tmxvwa2vf8] {
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    margin-right: 8px;
    font-weight: bold;
    border-radius: 50%;
    background-color: #e5e7eb;
    color: #9ca3af;
    font-size: 12px;
    transition: all 0.2s ease;
}

.requirement.valid .requirement-icon[b-tmxvwa2vf8] {
    background-color: #10b981;
    color: white;
}

/* Validation Messages */
.validation-message[b-tmxvwa2vf8] {
    display: flex;
    align-items: center;
    margin-top: 6px;
    font-size: 13px;
    font-weight: 500;
}

.validation-message.success[b-tmxvwa2vf8] {
    color: #10b981;
}

.validation-message.error[b-tmxvwa2vf8] {
    color: #ef4444;
}

.validation-icon[b-tmxvwa2vf8] {
    display: inline-block;
    margin-right: 6px;
    font-weight: bold;
}

/* Input State Styles */
.form-input.input-error[b-tmxvwa2vf8] {
    border-color: #ef4444;
}

.form-input.input-error:focus[b-tmxvwa2vf8] {
    outline-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.form-input.input-success[b-tmxvwa2vf8] {
    border-color: #10b981;
}

.form-input.input-success:focus[b-tmxvwa2vf8] {
    outline-color: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.1);
}
/* _content/Hirelab-frontend/Components/Pages/Login.razor.rz.scp.css */
/* Login Page Styles */

/* Global Box Sizing */
*[b-ptbcezd1ly] {
    box-sizing: border-box;
}

/* Role Selection Styles - Only shown for multi-role users */
.role-selection-container[b-ptbcezd1ly] {
    padding: 1.5rem 0;
}

.role-selection-header[b-ptbcezd1ly] {
    text-align: center;
    margin-bottom: 2rem;
}

.role-selection-title[b-ptbcezd1ly] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.75rem 0;
}

.role-selection-subtitle[b-ptbcezd1ly] {
    font-size: 0.875rem;
    color: #6b7280;
    line-height: 1.5;
    margin: 0;
}

.role-selection-options[b-ptbcezd1ly] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.role-selection-button[b-ptbcezd1ly] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1.25rem;
    background: white;
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
}

.role-selection-button:hover:not(:disabled)[b-ptbcezd1ly] {
    border-color: #667eea;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.role-selection-button:disabled[b-ptbcezd1ly] {
    opacity: 0.6;
    cursor: not-allowed;
}

.role-selection-icon[b-ptbcezd1ly] {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border-radius: 0.5rem;
    color: #667eea;
    margin-right: 1rem;
}

.role-selection-content[b-ptbcezd1ly] {
    flex: 1;
}

.role-selection-name[b-ptbcezd1ly] {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 0.25rem 0;
}

.role-selection-description[b-ptbcezd1ly] {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.4;
}

.role-selection-back[b-ptbcezd1ly] {
    width: 100%;
    padding: 0.75rem;
    background: #f3f4f6;
    border: none;
    border-radius: 0.375rem;
    color: #374151;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease;
}

.role-selection-back:hover[b-ptbcezd1ly] {
    background: #e5e7eb;
}

/* Theme Loading Screen */
.theme-loading-screen[b-ptbcezd1ly] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    /* Use neutral background that won't change when theme loads */
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    margin: 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    box-sizing: border-box;
    z-index: 9999;
}

.theme-loading-content[b-ptbcezd1ly] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
}

.theme-loading-spinner[b-ptbcezd1ly] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top-color: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    animation: spin-b-ptbcezd1ly 1s linear infinite;
}

.theme-loading-text[b-ptbcezd1ly] {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1rem;
    font-weight: 500;
    margin: 0;
}

@keyframes spin-b-ptbcezd1ly {
    to {
        transform: rotate(360deg);
    }
}

.login-container[b-ptbcezd1ly] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    /* Use tenant gradient if available, otherwise use default gradient */
    background: var(--tenant-primary-color, linear-gradient(135deg, #667eea 0%, #764ba2 100%));
    margin: 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    box-sizing: border-box;
}

.login-card[b-ptbcezd1ly] {
    max-width: 28rem;
    width: 100%;
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    padding: 2.5rem;
    border: 1px solid #e5e7eb;
    box-sizing: border-box;
}

.login-header[b-ptbcezd1ly] {
    text-align: center;
    margin-bottom: 1.5rem;
}

.login-title[b-ptbcezd1ly] {
    font-size: 1.875rem;
    font-weight: 700;
    margin: 0 0 0.75rem 0;
    line-height: 1.2;
    /* Color inherited from tenant-theme.css */
}

.login-subtitle[b-ptbcezd1ly] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
    line-height: 1.5;
}

.login-divider[b-ptbcezd1ly] {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 1.75rem 0;
    height: 0;
}

/* Form Styles */
.login-form[b-ptbcezd1ly] {
    margin-bottom: 0;
}

.form-group[b-ptbcezd1ly] {
    margin-bottom: 1.25rem;
}

.form-label[b-ptbcezd1ly] {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.5rem;
}

.form-input[b-ptbcezd1ly] {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    transition: all 0.15s ease-in-out;
    background-color: white;
    box-sizing: border-box;
}

.form-input:focus[b-ptbcezd1ly] {
    outline: none;
    /* Border color and shadow inherited from tenant-theme.css */
}

.form-input[b-ptbcezd1ly]::placeholder {
    color: #9ca3af;
}

/* Password Input Container */
.password-input-container[b-ptbcezd1ly] {
    position: relative;
    width: 100%;
}

.password-input-container .form-input[b-ptbcezd1ly] {
    padding-right: 3rem;
}

.password-toggle-btn[b-ptbcezd1ly] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
    transition: color 0.2s ease;
    border-radius: 0.25rem;
}

.password-toggle-btn:hover[b-ptbcezd1ly] {
    color: #374151;
    background-color: #f3f4f6;
}

.password-toggle-btn:focus[b-ptbcezd1ly] {
    outline: none;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5);
}

.password-icon[b-ptbcezd1ly] {
    width: 1.25rem;
    height: 1.25rem;
    stroke-width: 2;
}

/* Checkbox Styles */
.checkbox-container[b-ptbcezd1ly] {
    display: flex;
    align-items: center;
    margin-bottom: 1.5rem;
}

.checkbox-input[b-ptbcezd1ly] {
    width: 1rem;
    height: 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.25rem;
    margin: 0 0.5rem 0 0;
    flex-shrink: 0;
    cursor: pointer;
    /* Color inherited from tenant-theme.css */
}

.checkbox-label[b-ptbcezd1ly] {
    font-size: 0.875rem;
    color: #111827;
    margin: 0;
    cursor: pointer;
    user-select: none;
}

/* Button Styles */
.login-button[b-ptbcezd1ly] {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.875rem 1rem;
    background-color: #3b82f6;
    border: none;
    border-radius: 0.375rem;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    position: relative;
    color: white;
}

.login-button:hover:not(:disabled)[b-ptbcezd1ly] {
    background-color: #2563eb;
}

.login-button:focus[b-ptbcezd1ly] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3);
}

.login-button:disabled[b-ptbcezd1ly] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Loading Spinner */
.loading-spinner[b-ptbcezd1ly] {
    width: 1.25rem;
    height: 1.25rem;
    border: 2px solid transparent;
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-ptbcezd1ly 1s linear infinite;
    margin-right: 0.5rem;
}

@keyframes spin-b-ptbcezd1ly {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Alert Styles */
.alert[b-ptbcezd1ly] {
    padding: 0.875rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    max-width: 100%;
    box-sizing: border-box;
}

.alert-error[b-ptbcezd1ly] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.alert-success[b-ptbcezd1ly] {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.alert-icon[b-ptbcezd1ly] {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

.alert-icon-error[b-ptbcezd1ly] {
    color: #f87171;
}

.alert-icon-success[b-ptbcezd1ly] {
    color: #4ade80;
}

.alert-message[b-ptbcezd1ly] {
    font-size: 0.875rem;
    line-height: 1.5rem;
    margin: 0;
    flex: 1;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Additional Options */
.login-options[b-ptbcezd1ly] {
    text-align: center;
    margin-top: 0;
    padding-top: 0;
}

.employee-login-divider[b-ptbcezd1ly] {
    margin: 1rem 0 0.75rem 0;
}

.login-link[b-ptbcezd1ly] {
    display: inline-block;
    font-size: 0.875rem;
    text-decoration: none;
    margin-bottom: 1rem;
    transition: color 0.15s ease-in-out;
    /* Color inherited from tenant-theme.css */
}

.login-link:hover[b-ptbcezd1ly] {
    text-decoration: underline;
}

.login-text[b-ptbcezd1ly] {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}

.login-text-link[b-ptbcezd1ly] {
    text-decoration: none;
    transition: color 0.15s ease-in-out;
    font-weight: 500;
    /* Color inherited from tenant-theme.css */
}

.login-text-link:hover[b-ptbcezd1ly] {
    text-decoration: underline;
}

/* Responsive Design */
@media (max-width: 767px) {
    .login-container[b-ptbcezd1ly] {
        padding: 1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .login-card[b-ptbcezd1ly] {
        padding: 2rem 1.5rem;
        max-width: 100%;
    }

    .login-title[b-ptbcezd1ly] {
        font-size: 1.625rem;
    }
}

@media (max-width: 640px) {
    .login-container[b-ptbcezd1ly] {
        padding: 0.75rem;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .login-card[b-ptbcezd1ly] {
        padding: 1.5rem;
        max-width: 100%;
    }

    .login-title[b-ptbcezd1ly] {
        font-size: 1.5rem;
    }

    .login-subtitle[b-ptbcezd1ly] {
        font-size: 0.813rem;
    }

    .form-input[b-ptbcezd1ly] {
        padding: 0.625rem 0.875rem;
        font-size: 0.875rem;
    }

    .login-button[b-ptbcezd1ly] {
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
    }
}

@media (max-width: 400px) {
    .login-container[b-ptbcezd1ly] {
        padding: 0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .login-card[b-ptbcezd1ly] {
        padding: 1.25rem;
    }

    .login-title[b-ptbcezd1ly] {
        font-size: 1.375rem;
    }

    .login-subtitle[b-ptbcezd1ly] {
        font-size: 0.75rem;
    }

    .form-group[b-ptbcezd1ly] {
        margin-bottom: 1rem;
    }

    .form-input[b-ptbcezd1ly] {
        padding: 0.5rem 0.75rem;
        font-size: 0.813rem;
    }

    .login-button[b-ptbcezd1ly] {
        padding: 0.625rem 0.875rem;
        font-size: 0.813rem;
    }
}

/* Dark mode support - keeping card white */
@media (prefers-color-scheme: dark) {
    .login-card[b-ptbcezd1ly] {
        background-color: white;
        border-color: #e5e7eb;
    }

    .login-subtitle[b-ptbcezd1ly] {
        color: #6b7280;
    }

    .form-label[b-ptbcezd1ly] {
        color: #374151;
    }

    .form-input[b-ptbcezd1ly] {
        background-color: white;
        border-color: #d1d5db;
        color: #111827;
    }

    .checkbox-label[b-ptbcezd1ly] {
        color: #111827;
    }

    .login-text[b-ptbcezd1ly] {
        color: #6b7280;
    }

    /* Tenant colors inherited from tenant-theme.css */
}

/* Tenant Logo Watermark */
.tenant-logo-watermark[b-ptbcezd1ly] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 10;
    opacity: 0.9;
    transition: opacity 0.3s ease;
}

.tenant-logo-watermark:hover[b-ptbcezd1ly] {
    opacity: 1;
}

.tenant-logo-watermark img[b-ptbcezd1ly] {
    max-width: 150px;
    max-height: 80px;
    object-fit: contain;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.2));
}

@media (max-width: 640px) {
    .tenant-logo-watermark[b-ptbcezd1ly] {
        bottom: 1rem;
        right: 1rem;
        opacity: 0.7;
    }

    .tenant-logo-watermark img[b-ptbcezd1ly] {
        max-width: 100px;
        max-height: 60px;
    }
}

@media (max-width: 400px) {
    .tenant-logo-watermark[b-ptbcezd1ly] {
        bottom: 0.75rem;
        right: 0.75rem;
        opacity: 0.6;
    }

    .tenant-logo-watermark img[b-ptbcezd1ly] {
        max-width: 80px;
        max-height: 50px;
    }
}

/* ========== FORGOT PASSWORD STYLES ========== */

/* Progress Steps */
.progress-steps[b-ptbcezd1ly] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1.5rem 0;
}

.progress-step[b-ptbcezd1ly] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.progress-step-circle[b-ptbcezd1ly] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background-color: #e5e7eb;
    color: #9ca3af;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.875rem;
    transition: all 0.3s ease;
}

.progress-step.active .progress-step-circle[b-ptbcezd1ly] {
    background-color: #3b82f6;
    color: white;
}

.progress-step-label[b-ptbcezd1ly] {
    font-size: 0.75rem;
    color: #6b7280;
    font-weight: 500;
}

.progress-step.active .progress-step-label[b-ptbcezd1ly] {
    color: #3b82f6;
    font-weight: 600;
}

.progress-step-line[b-ptbcezd1ly] {
    width: 3rem;
    height: 2px;
    background-color: #e5e7eb;
    margin: 0 0.5rem;
    margin-bottom: 1.5rem;
    transition: all 0.3s ease;
}

.progress-step-line.active[b-ptbcezd1ly] {
    background-color: #3b82f6;
}

/* Form Hint */
.form-hint[b-ptbcezd1ly] {
    font-size: 0.75rem;
    color: #6b7280;
    margin-top: 0.5rem;
    margin-bottom: 0;
}

/* OTP Input */
#otp[b-ptbcezd1ly] {
    text-align: center;
    font-size: 1.5rem;
    letter-spacing: 0.5rem;
    font-weight: 600;
}

/* Secondary Button */
.secondary-button[b-ptbcezd1ly] {
    width: 100%;
    padding: 0.75rem 1.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    background-color: white;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    margin-top: 0.75rem;
}

.secondary-button:hover:not(:disabled)[b-ptbcezd1ly] {
    background-color: #f9fafb;
    border-color: #9ca3af;
}

.secondary-button:disabled[b-ptbcezd1ly] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Responsive - Forgot Password */
@media (max-width: 640px) {
    .progress-step-line[b-ptbcezd1ly] {
        width: 2rem;
    }

    .progress-step-circle[b-ptbcezd1ly] {
        width: 2rem;
        height: 2rem;
        font-size: 0.75rem;
    }

    .progress-step-label[b-ptbcezd1ly] {
        font-size: 0.625rem;
    }

    #otp[b-ptbcezd1ly] {
        font-size: 1.25rem;
        letter-spacing: 0.3rem;
    }

    .progress-steps[b-ptbcezd1ly] {
        margin: 1rem 0;
    }
}

@media (max-width: 400px) {
    .progress-step-line[b-ptbcezd1ly] {
        width: 1.5rem;
        margin: 0 0.25rem;
    }

    .progress-step-circle[b-ptbcezd1ly] {
        width: 1.75rem;
        height: 1.75rem;
        font-size: 0.688rem;
    }

    .progress-step-label[b-ptbcezd1ly] {
        font-size: 0.563rem;
    }

    #otp[b-ptbcezd1ly] {
        font-size: 1.125rem;
        letter-spacing: 0.25rem;
    }

    .secondary-button[b-ptbcezd1ly] {
        padding: 0.625rem 1rem;
        font-size: 0.813rem;
    }
}
/* _content/Hirelab-frontend/Components/UI/ActionButtons.razor.rz.scp.css */
/* Action Buttons */
.action-buttons[b-ebvwxby1kc] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 16px !important;
}

.action-btn[b-ebvwxby1kc] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    background: transparent !important;
    color: #6c757d !important;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    text-decoration: none !important;
    text-transform: none !important;
    gap: 4px !important;
}

.action-btn:hover[b-ebvwxby1kc] {
    background: #f8f9fa !important;
    transform: translateY(-1px) !important;
}

.action-btn.view-btn:hover[b-ebvwxby1kc] {
    color: #007bff !important;
    background: rgba(0, 123, 255, 0.1) !important;
}

.action-btn.edit-btn:hover[b-ebvwxby1kc] {
    color: #28a745 !important;
    background: rgba(40, 167, 69, 0.1) !important;
}

.action-btn.delete-btn:hover[b-ebvwxby1kc] {
    color: #dc3545 !important;
    background: rgba(220, 53, 69, 0.1) !important;
}

.action-btn svg[b-ebvwxby1kc] {
    flex-shrink: 0 !important;
}

.action-btn-text[b-ebvwxby1kc] {
    font-size: 14px;
    white-space: nowrap;
}

/* Hide text on very small screens */
@media (max-width: 480px) {
    .action-btn-text[b-ebvwxby1kc] {
        display: none;
    }

    .action-buttons[b-ebvwxby1kc] {
        gap: 8px !important;
    }
}
/* _content/Hirelab-frontend/Components/UI/AddCandidateToPositionModal.razor.rz.scp.css */
/* Overlay */
.add-candidate-modal-overlay[b-hy8yf30lwj] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
    animation: fadeIn-b-hy8yf30lwj 0.2s ease-out;
}

@keyframes fadeIn-b-hy8yf30lwj {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Modal Container */
.add-candidate-modal-container[b-hy8yf30lwj] {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 700px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-hy8yf30lwj 0.3s ease-out;
}

@keyframes slideUp-b-hy8yf30lwj {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Header */
.add-candidate-modal-header[b-hy8yf30lwj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 32px 32px 24px 32px;
    border-bottom: 1px solid #e5e7eb;
    gap: 20px;
}

.header-content[b-hy8yf30lwj] {
    flex: 1;
}

.modal-title[b-hy8yf30lwj] {
    font-size: 24px;
    font-weight: 700;
    color: var(--tenant-primary-color, #007bff);
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.candidate-name[b-hy8yf30lwj] {
    font-size: 18px;
    font-weight: 600;
    color: var(--tenant-primary-color, #007bff);
    margin: 0;
}

.modal-close-btn[b-hy8yf30lwj] {
    background: transparent;
    border: none;
    color: #6b7280;
    cursor: pointer;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    transition: all 0.2s;
    flex-shrink: 0;
}

.modal-close-btn:hover[b-hy8yf30lwj] {
    background: #f3f4f6;
    color: #111827;
}

/* Body */
.add-candidate-modal-body[b-hy8yf30lwj] {
    padding: 32px;
    overflow-y: auto;
    flex: 1;
}

/* Loading State */
.loading-state[b-hy8yf30lwj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 16px;
}

.loading-spinner[b-hy8yf30lwj] {
    width: 48px;
    height: 48px;
    border: 4px solid #e5e7eb;
    border-top-color: #6366f1;
    border-radius: 50%;
    animation: spin-b-hy8yf30lwj 0.8s linear infinite;
}

@keyframes spin-b-hy8yf30lwj {
    to {
        transform: rotate(360deg);
    }
}

.loading-text[b-hy8yf30lwj] {
    font-size: 16px;
    color: #6b7280;
    margin: 0;
}

/* Section Headers */
.section-header[b-hy8yf30lwj] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.section-header h3[b-hy8yf30lwj] {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.section-icon[b-hy8yf30lwj] {
    color: #6366f1;
    flex-shrink: 0;
}

.section-description[b-hy8yf30lwj] {
    font-size: 15px;
    color: #6b7280;
    line-height: 1.6;
    margin: 0 0 20px 0;
}

/* Templates Section */
.templates-section[b-hy8yf30lwj] {
    margin-bottom: 32px;
}

.templates-list[b-hy8yf30lwj] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Template Card */
.template-card[b-hy8yf30lwj] {
    background: #ffffff;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
    cursor: pointer;
    transition: all 0.2s;
    text-align: left;
    width: 100%;
}

.template-card:hover:not(:disabled)[b-hy8yf30lwj] {
    border-color: #6366f1;
    background: #f8f9ff;
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.15);
}

.template-card:disabled[b-hy8yf30lwj] {
    opacity: 0.6;
    cursor: not-allowed;
}

.template-card-content[b-hy8yf30lwj] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.template-card-header[b-hy8yf30lwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.template-name[b-hy8yf30lwj] {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin: 0;
    flex: 1;
}

.arrow-icon[b-hy8yf30lwj] {
    color: #6366f1;
    flex-shrink: 0;
    transition: transform 0.2s;
}

.template-card:hover:not(:disabled) .arrow-icon[b-hy8yf30lwj] {
    transform: translateX(4px);
}

.template-card-meta[b-hy8yf30lwj] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.meta-item[b-hy8yf30lwj] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #6b7280;
}

.meta-item svg[b-hy8yf30lwj] {
    flex-shrink: 0;
    color: #9ca3af;
}

/* Divider */
.divider[b-hy8yf30lwj] {
    display: flex;
    align-items: center;
    margin: 32px 0;
    position: relative;
}

.divider[b-hy8yf30lwj]::before {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.divider[b-hy8yf30lwj]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.divider-text[b-hy8yf30lwj] {
    padding: 0 16px;
    font-size: 14px;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Invite Section */
.invite-section[b-hy8yf30lwj] {
    /* No extra margin needed */
}

/* Invite Button */
.invite-btn[b-hy8yf30lwj] {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    color: #ffffff;
    border: none;
    border-radius: 12px;
    padding: 16px 24px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

.invite-btn:hover:not(:disabled)[b-hy8yf30lwj] {
    background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%);
    box-shadow: 0 6px 16px rgba(99, 102, 241, 0.4);
    transform: translateY(-2px);
}

.invite-btn:active:not(:disabled)[b-hy8yf30lwj] {
    transform: translateY(0);
}

.invite-btn:disabled[b-hy8yf30lwj] {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

.invite-btn svg[b-hy8yf30lwj] {
    flex-shrink: 0;
}

.btn-spinner[b-hy8yf30lwj] {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin-b-hy8yf30lwj 0.6s linear infinite;
}

/* Responsive */
@media (max-width: 768px) {
    .add-candidate-modal-overlay[b-hy8yf30lwj] {
        padding: 0;
    }

    .add-candidate-modal-container[b-hy8yf30lwj] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }

    .add-candidate-modal-header[b-hy8yf30lwj] {
        padding: 24px 20px 20px 20px;
    }

    .modal-title[b-hy8yf30lwj] {
        font-size: 20px;
    }

    .candidate-name[b-hy8yf30lwj] {
        font-size: 16px;
    }

    .add-candidate-modal-body[b-hy8yf30lwj] {
        padding: 24px 20px;
    }

    .section-header h3[b-hy8yf30lwj] {
        font-size: 16px;
    }

    .template-card[b-hy8yf30lwj] {
        padding: 16px;
    }

    .template-name[b-hy8yf30lwj] {
        font-size: 15px;
    }

    .template-card-meta[b-hy8yf30lwj] {
        flex-direction: column;
        gap: 8px;
    }

    .invite-btn[b-hy8yf30lwj] {
        padding: 14px 20px;
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .modal-title[b-hy8yf30lwj] {
        font-size: 18px;
    }

    .candidate-name[b-hy8yf30lwj] {
        font-size: 15px;
    }

    .template-card:hover:not(:disabled)[b-hy8yf30lwj] {
        transform: none;
    }
}
/* _content/Hirelab-frontend/Components/UI/Breadcrumb.razor.rz.scp.css */
.breadcrumbs[b-3dgp5hvhzj] {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.breadcrumb-item[b-3dgp5hvhzj] {
    color: #007bff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.breadcrumb-item:hover[b-3dgp5hvhzj] {
    text-decoration: underline;
}

.breadcrumb-item.disabled[b-3dgp5hvhzj] {
    color: #6c757d;
    cursor: default;
}

.breadcrumb-separator[b-3dgp5hvhzj] {
    color: #6c757d;
    font-size: 14px;
}
/* _content/Hirelab-frontend/Components/UI/CandidateReviewForm.razor.rz.scp.css */
/* CandidateReviewForm.razor.css - Blazor CSS Isolation */

.review-form-container[b-kp1bmcqeep] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 32px;
    margin-bottom: 24px;
}

.review-form-header[b-kp1bmcqeep] {
    margin-bottom: 32px;
    text-align: center;
}

.review-form-title[b-kp1bmcqeep] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 8px 0;
}

.review-form-subtitle[b-kp1bmcqeep] {
    color: #6c757d;
    margin: 0;
    font-size: 1rem;
}

.form-group[b-kp1bmcqeep] {
    margin-bottom: 24px;
}

.form-label[b-kp1bmcqeep] {
    display: block;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
    font-size: 0.875rem;
}

.rating-container[b-kp1bmcqeep] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.rating-star[b-kp1bmcqeep] {
    background: none;
    border: none;
    font-size: 2rem;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: all 0.2s ease;
    color: #d1d5db;
}

.rating-star:hover[b-kp1bmcqeep] {
    transform: scale(1.1);
    color: #fbbf24;
}

.rating-star.active[b-kp1bmcqeep] {
    color: #f59e0b;
}

.form-input[b-kp1bmcqeep] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 1rem;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.form-input:focus[b-kp1bmcqeep] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.form-textarea[b-kp1bmcqeep] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 1rem;
    font-family: inherit;
    resize: vertical;
    min-height: 120px;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.form-textarea:focus[b-kp1bmcqeep] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.checkbox-label[b-kp1bmcqeep] {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    font-size: 0.875rem;
    color: #374151;
}

.checkbox-text[b-kp1bmcqeep] {
    user-select: none;
}

.form-actions[b-kp1bmcqeep] {
    display: flex;
    gap: 16px;
    justify-content: flex-end;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}

.btn[b-kp1bmcqeep] {
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 2px solid transparent;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.btn:disabled[b-kp1bmcqeep] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary[b-kp1bmcqeep] {
    background: #3b82f6;
    color: white;
    border-color: #3b82f6;
}

.btn-primary:hover:not(:disabled)[b-kp1bmcqeep] {
    background: #2563eb;
    border-color: #2563eb;
}

.btn-secondary[b-kp1bmcqeep] {
    background: #6b7280;
    color: white;
    border-color: #6b7280;
}

.btn-secondary:hover:not(:disabled)[b-kp1bmcqeep] {
    background: #4b5563;
    border-color: #4b5563;
}

.loading-spinner-small[b-kp1bmcqeep] {
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: spin-b-kp1bmcqeep 1s linear infinite;
}

@keyframes spin-b-kp1bmcqeep {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.validation-message[b-kp1bmcqeep] {
    color: #dc2626;
    font-size: 0.75rem;
    margin-top: 4px;
    display: block;
}

/* Responsive Design */
@media (max-width: 768px) {
    .review-form-container[b-kp1bmcqeep] {
        padding: 24px;
        margin-bottom: 16px;
    }
    
    .rating-container[b-kp1bmcqeep] {
        justify-content: center;
    }
    
    .rating-star[b-kp1bmcqeep] {
        font-size: 1.5rem;
    }
    
    .form-actions[b-kp1bmcqeep] {
        flex-direction: column;
    }
    
    .btn[b-kp1bmcqeep] {
        width: 100%;
        justify-content: center;
    }
}

/* _content/Hirelab-frontend/Components/UI/CandidateReviewsDisplay.razor.rz.scp.css */
/* CandidateReviewsDisplay.razor.css - Blazor CSS Isolation */

.reviews-container[b-e6q03ry8ln] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 32px;
    margin-bottom: 24px;
}

.reviews-header[b-e6q03ry8ln] {
    margin-bottom: 32px;
    text-align: center;
}

.reviews-title[b-e6q03ry8ln] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 16px 0;
}

.reviews-summary[b-e6q03ry8ln] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.rating-summary[b-e6q03ry8ln] {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #f8fafc;
    padding: 16px 24px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.average-rating[b-e6q03ry8ln] {
    font-size: 2rem;
    font-weight: 700;
    color: #1a1a1a;
}

.stars-display[b-e6q03ry8ln] {
    display: flex;
    gap: 4px;
}

.star[b-e6q03ry8ln] {
    font-size: 1.25rem;
    color: #d1d5db;
}

.star.filled[b-e6q03ry8ln] {
    color: #f59e0b;
}

.review-count[b-e6q03ry8ln] {
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
}

.loading-container[b-e6q03ry8ln] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
}

.loading-spinner[b-e6q03ry8ln] {
    width: 32px;
    height: 32px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-e6q03ry8ln 1s linear infinite;
}

.loading-text[b-e6q03ry8ln] {
    margin-top: 12px;
    font-size: 1rem;
    color: #6c757d;
}

@keyframes spin-b-e6q03ry8ln {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.empty-state[b-e6q03ry8ln] {
    text-align: center;
    padding: 40px 20px;
}

.empty-state-icon[b-e6q03ry8ln] {
    font-size: 3rem;
    margin-bottom: 16px;
}

.empty-state-title[b-e6q03ry8ln] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #374151;
    margin: 0 0 8px 0;
}

.empty-state-message[b-e6q03ry8ln] {
    color: #6c757d;
    margin: 0;
}

.reviews-list[b-e6q03ry8ln] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.review-card[b-e6q03ry8ln] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    transition: box-shadow 0.2s ease;
}

.review-card:hover[b-e6q03ry8ln] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.review-header[b-e6q03ry8ln] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
    gap: 16px;
}

.reviewer-info[b-e6q03ry8ln] {
    flex: 1;
}

.reviewer-name[b-e6q03ry8ln] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 4px 0;
}

.reviewer-company[b-e6q03ry8ln] {
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
    margin-right: 8px;
}

.review-position[b-e6q03ry8ln] {
    color: #6c757d;
    font-size: 0.875rem;
    font-style: italic;
}

.review-meta[b-e6q03ry8ln] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.review-rating[b-e6q03ry8ln] {
    display: flex;
    gap: 2px;
}

.review-date[b-e6q03ry8ln] {
    color: #6c757d;
    font-size: 0.75rem;
    font-weight: 500;
}

.review-anonymous[b-e6q03ry8ln] {
    color: #6c757d;
    font-size: 0.75rem;
    font-style: italic;
}

.review-title[b-e6q03ry8ln] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 12px 0;
}

.review-content[b-e6q03ry8ln] {
    margin-top: 16px;
}

.review-text[b-e6q03ry8ln] {
    color: #374151;
    line-height: 1.6;
    margin: 0;
    white-space: pre-wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .reviews-container[b-e6q03ry8ln] {
        padding: 24px;
        margin-bottom: 16px;
    }
    
    .reviews-summary[b-e6q03ry8ln] {
        flex-direction: column;
        gap: 12px;
    }
    
    .rating-summary[b-e6q03ry8ln] {
        flex-direction: column;
        text-align: center;
        gap: 8px;
    }
    
    .review-header[b-e6q03ry8ln] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .review-meta[b-e6q03ry8ln] {
        align-items: flex-start;
        flex-direction: row;
        gap: 16px;
    }
    
    .review-card[b-e6q03ry8ln] {
        padding: 20px;
    }
}

/* _content/Hirelab-frontend/Components/UI/ConfirmActionDialog.razor.rz.scp.css */
/* Modal Overlay */
.modal-overlay[b-laq2uxazfo] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 2rem;
    animation: fadeIn-b-laq2uxazfo 0.2s ease;
}

@keyframes fadeIn-b-laq2uxazfo {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Confirm Action Dialog Styles */
.confirm-action-dialog[b-laq2uxazfo] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    max-width: 500px;
    width: 90vw;
    overflow: hidden;
    animation: slideIn-b-laq2uxazfo 0.3s ease;
}

@keyframes slideIn-b-laq2uxazfo {
    from {
        transform: translateY(-20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.dialog-header[b-laq2uxazfo] {
    padding: 1.5rem 1.5rem 1rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.dialog-title[b-laq2uxazfo] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0;
    padding-bottom: 0.5rem;
}

.dialog-icon[b-laq2uxazfo] {
    font-size: 1.5rem;
    line-height: 1;
    flex-shrink: 0;
}

.dialog-content[b-laq2uxazfo] {
    padding: 1.5rem;
}

.dialog-message[b-laq2uxazfo] {
    font-size: 1rem;
    color: #374151;
    line-height: 1.5;
    margin: 0;
}

.dialog-custom-content[b-laq2uxazfo] {
    margin-top: 1rem;
}

.dialog-actions[b-laq2uxazfo] {
    padding: 1rem 1.5rem 1.5rem 1.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

.dialog-button[b-laq2uxazfo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 80px;
}

.dialog-button:disabled[b-laq2uxazfo] {
    opacity: 0.6;
    cursor: not-allowed;
}

.dialog-button:focus[b-laq2uxazfo] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.dialog-button-cancel[b-laq2uxazfo] {
    background-color: transparent;
    color: #6b7280;
    border: 1px solid #d1d5db;
}

.dialog-button-cancel:hover:not(:disabled)[b-laq2uxazfo] {
    background-color: #f3f4f6;
    color: #374151;
}

.dialog-button-confirm[b-laq2uxazfo] {
    background-color: #ef4444;
    color: white;
}

.dialog-button-confirm:hover:not(:disabled)[b-laq2uxazfo] {
    background-color: #dc2626;
}

.dialog-button-confirm-primary[b-laq2uxazfo] {
    background-color: #3b82f6;
    color: white;
}

.dialog-button-confirm-primary:hover:not(:disabled)[b-laq2uxazfo] {
    background-color: #2563eb;
}

.dialog-button-confirm-warning[b-laq2uxazfo] {
    background-color: #f59e0b;
    color: white;
}

.dialog-button-confirm-warning:hover:not(:disabled)[b-laq2uxazfo] {
    background-color: #d97706;
}

.dialog-button-confirm-success[b-laq2uxazfo] {
    background-color: #10b981;
    color: white;
}

.dialog-button-confirm-success:hover:not(:disabled)[b-laq2uxazfo] {
    background-color: #059669;
}

/* Spinner for processing state */
.button-spinner[b-laq2uxazfo] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-laq2uxazfo 0.6s linear infinite;
}

@keyframes spin-b-laq2uxazfo {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .confirm-action-dialog[b-laq2uxazfo] {
        width: 95vw;
        margin: 1rem;
    }

    .dialog-header[b-laq2uxazfo] {
        padding: 1rem 1rem 0 1rem;
    }

    .dialog-content[b-laq2uxazfo] {
        padding: 1rem;
    }

    .dialog-actions[b-laq2uxazfo] {
        padding: 1rem;
        flex-direction: column;
    }

    .dialog-button[b-laq2uxazfo] {
        width: 100%;
    }
}
/* _content/Hirelab-frontend/Components/UI/DataTable.razor.rz.scp.css */
/* DataTable.razor.css - Reusable Data Table Component */

/* Container */
.data-table-container[b-454gwqz05c] {
    width: 100%;
    box-sizing: border-box;
}

/* Data Table */
.data-table[b-454gwqz05c] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
    box-sizing: border-box;
}

.data-table th[b-454gwqz05c] {
    text-align: left;
    padding: 12px;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    background: #f8f9fa;
}

.data-table th:last-child[b-454gwqz05c] {
    border-right: none;
}

.data-table td[b-454gwqz05c] {
    padding: 12px;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    vertical-align: middle;
}

.data-table td:last-child[b-454gwqz05c] {
    border-right: none;
}

.data-table tbody tr:hover[b-454gwqz05c] {
    background: #f8f9fa;
}

.data-table tbody tr:last-child td[b-454gwqz05c] {
    border-bottom: 1px solid #dee2e6;
}

/* Loading State */
.loading-container[b-454gwqz05c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
}

.loading-spinner[b-454gwqz05c] {
    width: 40px;
    height: 40px;
    border: 3px solid #e9ecef;
    border-top: 3px solid #007bff;
    border-radius: 50%;
    animation: spin-b-454gwqz05c 1s linear infinite;
}

.loading-text[b-454gwqz05c] {
    margin-top: 16px;
    font-size: 1.125rem;
    color: #6c757d;
    font-weight: 500;
}

@keyframes spin-b-454gwqz05c {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Empty State */
.empty-state[b-454gwqz05c] {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #e9ecef;
}

.empty-state-icon[b-454gwqz05c] {
    font-size: 4rem;
    margin-bottom: 16px;
}

.empty-state-title[b-454gwqz05c] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #495057;
}

.empty-state-message[b-454gwqz05c] {
    font-size: 14px;
    margin: 0;
    color: #6c757d;
}

/* Mobile Card View */
.mobile-card-view[b-454gwqz05c] {
    display: none;
}

.data-card[b-454gwqz05c] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    width: 100%;
}

.desktop-table-view[b-454gwqz05c] {
    display: block;
}

/* Responsive Design */
@media (max-width: 767px) {
    .desktop-table-view[b-454gwqz05c] {
        display: none;
    }

    .mobile-card-view[b-454gwqz05c] {
        display: block;
    }

    .data-card[b-454gwqz05c] {
        padding: 14px;
        margin-bottom: 10px;
    }
}

@media (min-width: 480px) and (max-width: 767px) {
    .desktop-table-view[b-454gwqz05c] {
        display: block;
    }

    .mobile-card-view[b-454gwqz05c] {
        display: none;
    }
}

/* Utility Classes for Table Content */
[b-454gwqz05c] .text-center {
    text-align: center;
}

[b-454gwqz05c] .text-right {
    text-align: right;
}

[b-454gwqz05c] .text-left {
    text-align: left;
}

[b-454gwqz05c] .hide-mobile {
    display: table-cell;
}

[b-454gwqz05c] .hide-tablet {
    display: table-cell;
}

@media (max-width: 767px) {
    [b-454gwqz05c] .hide-mobile {
        display: none;
    }
}

@media (max-width: 1199px) {
    [b-454gwqz05c] .hide-tablet {
        display: none;
    }
}

/* Status Badges */
[b-454gwqz05c] .status-badge {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    display: inline-block;
}

[b-454gwqz05c] .status-badge.active {
    background: #d4edda;
    color: #155724;
}

[b-454gwqz05c] .status-badge.inactive {
    background: #fff3cd;
    color: #856404;
}

[b-454gwqz05c] .status-badge.suspended {
    background: #f8d7da;
    color: #721c24;
}

[b-454gwqz05c] .status-badge.info {
    background: #d1ecf1;
    color: #0c5460;
}

[b-454gwqz05c] .status-badge.success {
    background: #d4edda;
    color: #155724;
}

[b-454gwqz05c] .status-badge.warning {
    background: #fff3cd;
    color: #856404;
}

[b-454gwqz05c] .status-badge.danger {
    background: #f8d7da;
    color: #721c24;
}

[b-454gwqz05c] .status-badge.primary {
    background: #cce5ff;
    color: #004085;
}

[b-454gwqz05c] .status-badge.secondary {
    background: #e2e3e5;
    color: #383d41;
}

/* Cell Helpers */
[b-454gwqz05c] .cell-name {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

[b-454gwqz05c] .cell-name-primary {
    font-weight: 600;
    color: #212529;
}

[b-454gwqz05c] .cell-name-secondary {
    font-size: 0.875rem;
    color: #6c757d;
}

[b-454gwqz05c] .cell-location {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

[b-454gwqz05c] .cell-location-primary {
    color: #212529;
}

[b-454gwqz05c] .cell-location-secondary {
    font-size: 0.875rem;
    color: #6c757d;
}

[b-454gwqz05c] .text-muted {
    color: #6c757d;
}

/* Review/Rating Styles */
[b-454gwqz05c] .review-summary {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

[b-454gwqz05c] .review-rating {
    display: flex;
    gap: 2px;
}

[b-454gwqz05c] .review-rating .star {
    font-size: 0.875rem;
    color: #d1d5db;
}

[b-454gwqz05c] .review-rating .star.filled {
    color: #f59e0b;
}

[b-454gwqz05c] .review-count {
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: 500;
}

/* Mobile Card Specific Styles */
[b-454gwqz05c] .card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

[b-454gwqz05c] .card-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
    margin: 0 0 4px 0;
}

[b-454gwqz05c] .card-subtitle {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

[b-454gwqz05c] .card-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

[b-454gwqz05c] .card-info-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

[b-454gwqz05c] .card-info-label {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    font-weight: 600;
}

[b-454gwqz05c] .card-info-value {
    font-size: 0.875rem;
    color: #212529;
    font-weight: 500;
}

[b-454gwqz05c] .card-actions {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 12px;
}

/* Small Screen Adjustments */
@media (max-width: 576px) {
    .loading-container[b-454gwqz05c] {
        padding: 40px 16px;
    }

    .loading-text[b-454gwqz05c] {
        font-size: 1rem;
    }

    .empty-state[b-454gwqz05c] {
        padding: 40px 16px;
    }

    .empty-state-icon[b-454gwqz05c] {
        font-size: 3rem;
    }

    .empty-state-title[b-454gwqz05c] {
        font-size: 1.125rem;
    }

    .data-card[b-454gwqz05c] {
        padding: 12px;
        margin-bottom: 8px;
    }

    [b-454gwqz05c] .card-title {
        font-size: 1rem;
    }

    [b-454gwqz05c] .card-info {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

@media (max-width: 400px) {
    .data-card[b-454gwqz05c] {
        padding: 10px;
    }

    [b-454gwqz05c] .card-title {
        font-size: 0.938rem;
    }

    [b-454gwqz05c] .card-info {
        gap: 8px;
    }
}
/* _content/Hirelab-frontend/Components/UI/DynamicFilterPanel.razor.rz.scp.css */
/* DynamicFilterPanel.razor.css - Blazor CSS Isolation */

/* Filters Panel */
.filters-panel[b-nj9c3y5wf8] {
    margin-bottom: 20px;
}

.filters-grid[b-nj9c3y5wf8] {
    display: grid;
    gap: 16px;
    margin-bottom: 16px;
}

.filter-group[b-nj9c3y5wf8] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.filter-label[b-nj9c3y5wf8] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #495057;
}

.form-select[b-nj9c3y5wf8] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: white;
    font-size: 0.875rem;
    color: #495057;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-select:focus[b-nj9c3y5wf8] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.form-select:disabled[b-nj9c3y5wf8] {
    background-color: #e9ecef;
    opacity: 0.6;
    cursor: not-allowed;
}

/* Text Input Fields */
.form-control[b-nj9c3y5wf8] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: white;
    font-size: 0.875rem;
    color: #495057;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control:focus[b-nj9c3y5wf8] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* Filters Actions */
.filters-actions[b-nj9c3y5wf8] {
    display: flex;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px solid #e9ecef;
}

/* Active Filters (Chips) */
.active-filters[b-nj9c3y5wf8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.filter-chip[b-nj9c3y5wf8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 16px;
    padding: 4px 12px;
    font-size: 0.875rem;
    color: #495057;
}

.filter-chip button[b-nj9c3y5wf8] {
    background: none;
    border: none;
    color: #6c757d;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    margin: 0;
    transition: color 0.2s ease;
}

.filter-chip button:hover[b-nj9c3y5wf8] {
    color: #dc3545;
}

/* Button Styles */
.btn-text[b-nj9c3y5wf8] {
    background: none;
    border: none;
    color: #007bff;
    font-size: 0.875rem;
    cursor: pointer;
    padding: 6px 12px;
    transition: all 0.2s ease;
}

.btn-text:hover[b-nj9c3y5wf8] {
    text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
    .filters-grid[b-nj9c3y5wf8] {
        grid-template-columns: 1fr;
    }
}
/* _content/Hirelab-frontend/Components/UI/EditCandidateModal.razor.rz.scp.css */
/* Overlay */
.edit-candidate-modal-overlay[b-1anmpu3fj0] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
    animation: fadeIn-b-1anmpu3fj0 0.2s ease-out;
}

@keyframes fadeIn-b-1anmpu3fj0 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Modal Container */
.edit-candidate-modal-container[b-1anmpu3fj0] {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 800px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-1anmpu3fj0 0.3s ease-out;
}

@keyframes slideUp-b-1anmpu3fj0 {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Header */
.edit-candidate-modal-header[b-1anmpu3fj0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 32px 32px 24px 32px;
    border-bottom: 1px solid #e5e7eb;
    gap: 20px;
}

.header-content[b-1anmpu3fj0] {
    flex: 1;
}

.modal-title[b-1anmpu3fj0] {
    font-size: 24px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.candidate-subtitle[b-1anmpu3fj0] {
    font-size: 16px;
    font-weight: 500;
    color: #6b7280;
    margin: 0;
}

.modal-close-btn[b-1anmpu3fj0] {
    background: transparent;
    border: none;
    color: #6b7280;
    cursor: pointer;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    transition: all 0.2s;
    flex-shrink: 0;
}

.modal-close-btn:hover:not(:disabled)[b-1anmpu3fj0] {
    background: #f3f4f6;
    color: #111827;
}

.modal-close-btn:disabled[b-1anmpu3fj0] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Body */
.edit-candidate-modal-body[b-1anmpu3fj0] {
    padding: 32px;
    overflow-y: auto;
    flex: 1;
}

/* Loading State */
.loading-state[b-1anmpu3fj0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 16px;
}

.loading-spinner[b-1anmpu3fj0] {
    width: 48px;
    height: 48px;
    border: 4px solid #e5e7eb;
    border-top-color: #6366f1;
    border-radius: 50%;
    animation: spin-b-1anmpu3fj0 0.8s linear infinite;
}

@keyframes spin-b-1anmpu3fj0 {
    to {
        transform: rotate(360deg);
    }
}

.loading-text[b-1anmpu3fj0] {
    font-size: 16px;
    color: #6b7280;
    margin: 0;
}

/* Form */
.edit-form[b-1anmpu3fj0] {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

/* Form Sections */
.form-section[b-1anmpu3fj0] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.section-title[b-1anmpu3fj0] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin: 0;
    padding-bottom: 16px;
    border-bottom: 2px solid #e5e7eb;
}

.section-icon[b-1anmpu3fj0] {
    color: var(--tenant-primary-color, #6366f1);
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-1anmpu3fj0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

/* Form Groups */
.form-group[b-1anmpu3fj0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-label[b-1anmpu3fj0] {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 4px;
}

.required[b-1anmpu3fj0] {
    color: #ef4444;
    font-weight: 700;
}

/* Form Inputs */
.form-input[b-1anmpu3fj0],
.form-select[b-1anmpu3fj0] {
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 15px;
    color: #111827;
    background: #ffffff;
    transition: all 0.2s;
    outline: none;
}

.form-input:focus[b-1anmpu3fj0],
.form-select:focus[b-1anmpu3fj0] {
    border-color: var(--tenant-primary-color, #6366f1);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

.form-input:disabled[b-1anmpu3fj0],
.form-select:disabled[b-1anmpu3fj0] {
    background: #f9fafb;
    color: #9ca3af;
    cursor: not-allowed;
}

.form-input.error[b-1anmpu3fj0] {
    border-color: #ef4444;
}

.form-input.error:focus[b-1anmpu3fj0] {
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

/* Error Message */
.error-message[b-1anmpu3fj0] {
    font-size: 13px;
    color: #ef4444;
    font-weight: 500;
}

/* Help Text */
.help-text[b-1anmpu3fj0] {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
}

/* Status Toggle */
.status-toggle-container[b-1anmpu3fj0] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.status-toggle[b-1anmpu3fj0] {
    display: flex;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    user-select: none;
}

.status-toggle input[type="checkbox"][b-1anmpu3fj0] {
    display: none;
}

.toggle-slider[b-1anmpu3fj0] {
    position: relative;
    width: 56px;
    height: 32px;
    background: #d1d5db;
    border-radius: 16px;
    transition: all 0.3s;
    flex-shrink: 0;
}

.toggle-slider[b-1anmpu3fj0]::before {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    width: 24px;
    height: 24px;
    background: #ffffff;
    border-radius: 50%;
    transition: all 0.3s;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.status-toggle input[type="checkbox"]:checked + .toggle-slider[b-1anmpu3fj0] {
    background: var(--tenant-primary-color, #10b981);
}

.status-toggle input[type="checkbox"]:checked + .toggle-slider[b-1anmpu3fj0]::before {
    transform: translateX(24px);
}

.status-toggle input[type="checkbox"]:disabled + .toggle-slider[b-1anmpu3fj0] {
    opacity: 0.5;
    cursor: not-allowed;
}

.toggle-label[b-1anmpu3fj0] {
    font-size: 16px;
    font-weight: 600;
}

.status-active[b-1anmpu3fj0] {
    color: #10b981;
}

.status-inactive[b-1anmpu3fj0] {
    color: #6b7280;
}

/* Error Banner */
.error-banner[b-1anmpu3fj0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #991b1b;
    font-size: 14px;
    font-weight: 500;
}

.error-banner svg[b-1anmpu3fj0] {
    flex-shrink: 0;
    color: #ef4444;
}

/* Modal Footer */
.modal-footer[b-1anmpu3fj0] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}

/* Buttons */
.btn-primary[b-1anmpu3fj0],
.btn-secondary[b-1anmpu3fj0] {
    padding: 12px 24px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: none;
    outline: none;
}

.btn-primary[b-1anmpu3fj0] {
    background: linear-gradient(135deg, var(--tenant-primary-color, #6366f1) 0%, var(--tenant-primary-color, #4f46e5) 100%);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

.btn-primary:hover:not(:disabled)[b-1anmpu3fj0] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(99, 102, 241, 0.4);
}

.btn-primary:active:not(:disabled)[b-1anmpu3fj0] {
    transform: translateY(0);
}

.btn-primary:disabled[b-1anmpu3fj0] {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

.btn-primary svg[b-1anmpu3fj0] {
    flex-shrink: 0;
}

.btn-secondary[b-1anmpu3fj0] {
    background: #ffffff;
    color: #374151;
    border: 2px solid #e5e7eb;
}

.btn-secondary:hover:not(:disabled)[b-1anmpu3fj0] {
    background: #f9fafb;
    border-color: #d1d5db;
}

.btn-secondary:disabled[b-1anmpu3fj0] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-spinner[b-1anmpu3fj0] {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin-b-1anmpu3fj0 0.6s linear infinite;
}

/* Responsive */
@media (max-width: 768px) {
    .edit-candidate-modal-overlay[b-1anmpu3fj0] {
        padding: 0;
    }

    .edit-candidate-modal-container[b-1anmpu3fj0] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }

    .edit-candidate-modal-header[b-1anmpu3fj0] {
        padding: 24px 20px 20px 20px;
    }

    .modal-title[b-1anmpu3fj0] {
        font-size: 20px;
    }

    .candidate-subtitle[b-1anmpu3fj0] {
        font-size: 14px;
    }

    .edit-candidate-modal-body[b-1anmpu3fj0] {
        padding: 24px 20px;
    }

    .form-grid[b-1anmpu3fj0] {
        grid-template-columns: 1fr;
    }

    .section-title[b-1anmpu3fj0] {
        font-size: 16px;
    }

    .modal-footer[b-1anmpu3fj0] {
        flex-direction: column-reverse;
    }

    .btn-primary[b-1anmpu3fj0],
    .btn-secondary[b-1anmpu3fj0] {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .modal-title[b-1anmpu3fj0] {
        font-size: 18px;
    }

    .edit-candidate-modal-header[b-1anmpu3fj0] {
        padding: 20px 16px 16px 16px;
    }

    .edit-candidate-modal-body[b-1anmpu3fj0] {
        padding: 20px 16px;
    }

    .form-section[b-1anmpu3fj0] {
        gap: 16px;
    }

    .edit-form[b-1anmpu3fj0] {
        gap: 24px;
    }
}
/* _content/Hirelab-frontend/Components/UI/MainOutlinedButton.razor.rz.scp.css */
/* Main Outlined Button - Blue border that fills on hover */

.main-outlined-btn[b-ixe2xjypfo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-decoration: none;
    white-space: nowrap;
    min-height: 40px;
    /* Outline style - transparent with tenant secondary color border */
    background-color: transparent !important;
    background-image: none !important;
    color: var(--tenant-secondary-color) !important;
    border: 1px solid var(--tenant-secondary-color) !important;
    box-shadow: none !important;
    /* Reset browser defaults */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
    font-family: inherit;
}

.main-outlined-btn:hover:not(:disabled)[b-ixe2xjypfo] {
    background-color: var(--tenant-secondary-color) !important;
    background-image: none !important;
    color: white !important;
    border-color: var(--tenant-secondary-color) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-flex !important;
}

.main-outlined-btn:active[b-ixe2xjypfo] {
    background-color: var(--tenant-secondary-color) !important;
    background-image: none !important;
    color: white !important;
    border-color: var(--tenant-secondary-color) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-flex !important;
    transform: none !important;
}

.main-outlined-btn:focus[b-ixe2xjypfo] {
    outline: 2px solid var(--tenant-secondary-color) !important;
    outline-offset: 2px;
    background-color: transparent !important;
    color: var(--tenant-secondary-color) !important;
    border-color: var(--tenant-secondary-color) !important;
}

.main-outlined-btn:disabled[b-ixe2xjypfo] {
    opacity: 0.5;
    cursor: not-allowed;
    background-color: transparent !important;
    color: var(--tenant-secondary-color) !important;
    border-color: var(--tenant-secondary-color) !important;
}

/* Size Variants */
.main-outlined-btn.btn-sm[b-ixe2xjypfo] {
    padding: 6px 12px;
    font-size: 12px;
    min-height: 32px;
}

.main-outlined-btn.btn-lg[b-ixe2xjypfo] {
    padding: 14px 28px;
    font-size: 16px;
    min-height: 48px;
}

/* Full Width */
.main-outlined-btn.btn-block[b-ixe2xjypfo] {
    width: 100%;
    display: flex;
}

/* Icon Styling */
.main-outlined-btn .btn-icon[b-ixe2xjypfo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.main-outlined-btn .btn-icon svg[b-ixe2xjypfo] {
    width: 16px;
    height: 16px;
}

.main-outlined-btn.btn-lg .btn-icon svg[b-ixe2xjypfo] {
    width: 20px;
    height: 20px;
}

.main-outlined-btn.btn-sm .btn-icon svg[b-ixe2xjypfo] {
    width: 14px;
    height: 14px;
}

/* Loading Spinner */
.btn-spinner[b-ixe2xjypfo] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spin-b-ixe2xjypfo 0.6s linear infinite;
}

.main-outlined-btn.btn-lg .btn-spinner[b-ixe2xjypfo] {
    width: 20px;
    height: 20px;
    border-width: 3px;
}

.main-outlined-btn.btn-sm .btn-spinner[b-ixe2xjypfo] {
    width: 14px;
    height: 14px;
}

@keyframes spin-b-ixe2xjypfo {
    to {
        transform: rotate(360deg);
    }
}

/* Loading State */
.main-outlined-btn.btn-loading[b-ixe2xjypfo] {
    position: relative;
}

/* Responsive text display */
.d-none-xs[b-ixe2xjypfo] {
    display: inline;
}

.d-inline-xs[b-ixe2xjypfo] {
    display: none;
}

@media (max-width: 576px) {
    .d-none-xs[b-ixe2xjypfo] {
        display: none;
    }

    .d-inline-xs[b-ixe2xjypfo] {
        display: inline;
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .main-outlined-btn[b-ixe2xjypfo] {
        padding: 8px 16px;
        font-size: 13px;
        min-height: 36px;
    }

    .main-outlined-btn.btn-lg[b-ixe2xjypfo] {
        padding: 12px 24px;
        font-size: 15px;
        min-height: 44px;
    }
}
/* _content/Hirelab-frontend/Components/UI/PageActionBar.razor.rz.scp.css */
/* Stats Container */
.stats-container[b-bs9lah3qhw] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    padding: 1.5rem;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 1rem;
}

.stat-item[b-bs9lah3qhw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.stat-icon[b-bs9lah3qhw] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    opacity: 0.8;
}

.stat-number[b-bs9lah3qhw] {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 0.5rem;
}

.stat-number.stat-primary[b-bs9lah3qhw] {
    color: #007bff;
}

.stat-number.stat-success[b-bs9lah3qhw] {
    color: #28a745;
}

.stat-number.stat-warning[b-bs9lah3qhw] {
    color: #ffc107;
}

.stat-number.stat-danger[b-bs9lah3qhw] {
    color: #dc3545;
}

.stat-number.stat-info[b-bs9lah3qhw] {
    color: #17a2b8;
}

.stat-number.stat-secondary[b-bs9lah3qhw] {
    color: #6c757d;
}

.stat-label[b-bs9lah3qhw] {
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-subvalue[b-bs9lah3qhw] {
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 0.25rem;
}

.stat-divider[b-bs9lah3qhw] {
    width: 1px;
    height: 2.5rem;
    background-color: #e5e7eb;
}

/* Paper Container for Action Bar */
.paper[b-bs9lah3qhw] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    margin-bottom: 16px;
    box-sizing: border-box;
    width: 100%;
}

/* Action Bar */
.action-bar[b-bs9lah3qhw] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
    box-sizing: border-box;
    width: 100%;
}

.action-bar-left[b-bs9lah3qhw] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    flex: 1;
    width: 100%;
    flex-wrap: wrap;
}

/* Text Field / Search */
.text-field[b-bs9lah3qhw] {
    flex: 1;
    min-width: 200px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}

.search-input-wrapper[b-bs9lah3qhw] {
    position: relative;
    flex: 1;
    width: 100%;
    display: flex;
    align-items: center;
}

.text-field input[b-bs9lah3qhw] {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    font-size: 16px;
    background: white;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
    max-width: 100%;
}

.text-field input:focus[b-bs9lah3qhw] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

/* Search Field with Button */
.search-field-with-button[b-bs9lah3qhw] {
    display: flex;
    gap: 12px;
    align-items: center;
    position: relative;
}

.search-field-with-button input[b-bs9lah3qhw] {
    flex: 1;
}

.search-field input.has-value[b-bs9lah3qhw] {
    padding-right: 40px;
}

.search-field-with-button input.has-value[b-bs9lah3qhw] {
    padding-right: 40px;
}

/* Search Field with Button */
.search-field-with-button[b-bs9lah3qhw] {
    display: flex;
    gap: 12px;
    align-items: center;
    position: relative;
}

.search-field-with-button input[b-bs9lah3qhw] {
    flex: 1;
}

.search-field input.has-value[b-bs9lah3qhw] {
    padding-right: 40px;
}

.search-field-with-button input.has-value[b-bs9lah3qhw] {
    padding-right: 40px;
}

.search-button[b-bs9lah3qhw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    white-space: nowrap;
    min-height: 40px;
    /* Outline style - transparent with blue border, matching MainOutlinedButton */
    background-color: transparent !important;
    background-image: none !important;
    color: var(--tenant-secondary-color, #007bff) !important;
    border: 1px solid var(--tenant-secondary-color, #007bff) !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
    font-family: inherit !important;
}

.search-button:hover:not(:disabled)[b-bs9lah3qhw] {
    background-color: var(--tenant-secondary-color, #007bff) !important;
    background-image: none !important;
    color: white !important;
    border-color: var(--tenant-secondary-color, #007bff) !important;
}

.search-button:focus[b-bs9lah3qhw] {
    outline: 2px solid var(--tenant-primary-color, #007bff) !important;
    outline-offset: 2px !important;
    background-color: transparent !important;
    color: var(--tenant-secondary-color, #007bff) !important;
    border-color: var(--tenant-secondary-color, #007bff) !important;
}

.search-button:disabled[b-bs9lah3qhw] {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    background-color: transparent !important;
    color: var(--tenant-secondary-color, #007bff) !important;
    border-color: var(--tenant-secondary-color, #007bff) !important;
}

/* Ensure MainOutlinedButton works when rendered inside PageActionBar */
[b-bs9lah3qhw] .main-outlined-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    min-height: 40px !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--tenant-primary-color, #007bff) !important;
    border: 1px solid var(--tenant-primary-color, #007bff) !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
    font-family: inherit !important;
}

[b-bs9lah3qhw] .main-outlined-btn:hover:not(:disabled) {
    background-color: var(--tenant-primary-color, #007bff) !important;
    background-image: none !important;
    color: white !important;
    border-color: var(--tenant-primary-color, #007bff) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-flex !important;
}

[b-bs9lah3qhw] .main-outlined-btn:active {
    background-color: var(--tenant-primary-color, #007bff) !important;
    background-image: none !important;
    color: white !important;
    border-color: var(--tenant-primary-color, #007bff) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-flex !important;
    transform: none !important;
}

[b-bs9lah3qhw] .main-outlined-btn:focus {
    outline: 2px solid var(--tenant-primary-color, #007bff) !important;
    outline-offset: 2px !important;
    background-color: transparent !important;
    color: var(--tenant-primary-color, #007bff) !important;
    border-color: var(--tenant-primary-color, #007bff) !important;
}

[b-bs9lah3qhw] .main-outlined-btn:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    background-color: transparent !important;
    color: var(--tenant-primary-color, #007bff) !important;
    border-color: var(--tenant-primary-color, #007bff) !important;
}

/* Clear Button */
.clear-button[b-bs9lah3qhw] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: #6c757d;
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
    width: 24px;
    height: 24px;
    z-index: 1;
}

.clear-button:hover[b-bs9lah3qhw] {
    background: #f0f0f0;
    color: #495057;
}

/* Select Container / Sort By */
.select-container[b-bs9lah3qhw] {
    position: relative;
    min-width: 200px;
    flex-shrink: 0;
}

.select-container.sort-select[b-bs9lah3qhw] {
    min-width: 220px;
}

.select-container.filter-select[b-bs9lah3qhw] {
    min-width: 180px;
}

.select[b-bs9lah3qhw] {
    width: 100%;
    padding: 12px 40px 12px 12px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    background: white;
    font-size: 14px;
    color: #495057;
    cursor: pointer;
    appearance: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.select:focus[b-bs9lah3qhw] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.select-arrow[b-bs9lah3qhw] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #6c757d;
    font-size: 12px;
}

/* Action Controls */
.action-controls[b-bs9lah3qhw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

/* Tablet Responsive */
@media (min-width: 540px) {
    .action-controls[b-bs9lah3qhw] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .action-bar-left[b-bs9lah3qhw] {
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .text-field[b-bs9lah3qhw] {
        flex: 1;
        min-width: 250px;
        max-width: 350px;
    }

    .search-field-with-button[b-bs9lah3qhw] {
        flex: 1;
        min-width: 250px;
        max-width: 500px;
    }

    .search-field-with-button input[b-bs9lah3qhw] {
        flex: 1;
    }

    .select-container.sort-select[b-bs9lah3qhw] {
        min-width: 200px;
        width: auto;
    }
}

@media (min-width: 768px) {
    .action-bar[b-bs9lah3qhw] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .action-bar-left[b-bs9lah3qhw] {
        flex-direction: row;
        align-items: center;
        width: auto;
        flex-wrap: nowrap;
    }

    .text-field[b-bs9lah3qhw] {
        flex: 1;
        min-width: 300px;
        max-width: 400px;
    }

    .search-field-with-button[b-bs9lah3qhw] {
        flex: 1;
        min-width: 300px;
        max-width: 600px;
    }

    .search-field-with-button input[b-bs9lah3qhw] {
        flex: 1;
    }

    .select-container.sort-select[b-bs9lah3qhw] {
        min-width: 220px;
        width: auto;
    }

    .action-controls[b-bs9lah3qhw] {
        width: auto;
        justify-content: flex-end;
    }
}

/* Mobile Responsive */
@media (max-width: 539px) {
    .action-bar-left[b-bs9lah3qhw] {
        flex-direction: column;
        flex-wrap: wrap;
        align-items: stretch;
    }

    .text-field[b-bs9lah3qhw] {
        width: 100%;
        max-width: 100%;
    }

    .search-field-with-button[b-bs9lah3qhw] {
        width: 100%;
        max-width: 100%;
        flex-direction: column;
        gap: 8px;
    }

    .search-field-with-button input[b-bs9lah3qhw] {
        width: 100%;
    }

    .search-button[b-bs9lah3qhw] {
        width: 100%;
    }

    .select-container.sort-select[b-bs9lah3qhw] {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .stats-container[b-bs9lah3qhw] {
        gap: 1rem;
        padding: 1rem;
        flex-wrap: wrap;
    }

    .stat-number[b-bs9lah3qhw] {
        font-size: 1.5rem;
    }

    .stat-label[b-bs9lah3qhw] {
        font-size: 0.75rem;
    }

    .stat-divider[b-bs9lah3qhw] {
        display: none;
    }

    .text-field input[b-bs9lah3qhw] {
        padding: 10px 14px;
        font-size: 16px;
    }

    .paper[b-bs9lah3qhw] {
        padding: 14px;
    }
}

@media (max-width: 576px) {
    .text-field input[b-bs9lah3qhw] {
        padding: 8px 12px;
        font-size: 14px;
    }

    .action-bar[b-bs9lah3qhw] {
        padding: 12px;
    }

    .paper[b-bs9lah3qhw] {
        padding: 12px;
    }
}

@media (max-width: 480px) {
    .stats-container[b-bs9lah3qhw] {
        gap: 0.75rem;
    }

    .stat-item[b-bs9lah3qhw] {
        min-width: 80px;
    }

    .stat-number[b-bs9lah3qhw] {
        font-size: 1.25rem;
    }
}
/* _content/Hirelab-frontend/Components/UI/Pagination.razor.rz.scp.css */
/* Pagination Component Styles */

.pagination-container[b-hbav8upq0j] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    padding: 16px;
}

.pagination-container.flat[b-hbav8upq0j] {
    background: transparent;
    padding: 16px 0;
    margin-top: 16px;
}

@media (min-width: 768px) {
    .pagination-container[b-hbav8upq0j] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
}

.pagination-info p[b-hbav8upq0j] {
    font-size: 14px;
    color: #6c757d;
    margin: 0;
}

.pagination[b-hbav8upq0j] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.pagination-button[b-hbav8upq0j] {
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    background: white;
    color: #495057;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    font-size: 14px;
    min-width: 40px;
}

.pagination-button:hover:not(:disabled)[b-hbav8upq0j] {
    background: #f8f9fa;
    border-color: #adb5bd;
}

.pagination-button:disabled[b-hbav8upq0j] {
    opacity: 0.6;
    cursor: not-allowed;
}

.pagination-button.active[b-hbav8upq0j] {
    background: #007bff;
    color: white;
    border-color: #007bff;
}

.pagination-controls-group[b-hbav8upq0j] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}

@media (min-width: 768px) {
    .pagination-controls-group[b-hbav8upq0j] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        flex: 1;
    }
}

.page-size-selector[b-hbav8upq0j] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.page-size-selector .filter-label[b-hbav8upq0j] {
    margin: 0;
    font-size: 14px;
    color: #6c757d;
    white-space: nowrap;
}

.page-size-selector .form-select[b-hbav8upq0j] {
    min-width: 120px;
    padding: 6px 12px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    background: white;
    font-size: 14px;
    cursor: pointer;
}

.page-size-selector .form-select:focus[b-hbav8upq0j] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
/* _content/Hirelab-frontend/Components/UI/SearchableDropdown.razor.rz.scp.css */
/* Searchable Dropdown Component Styles */

.dropdown-backdrop[b-hp7kbqhbb2] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9998;
    background: transparent;
}

.searchable-dropdown-wrapper[b-hp7kbqhbb2] {
    position: relative;
    width: 100%;
    z-index: 1;
}

.searchable-dropdown-wrapper:has(.searchable-dropdown-menu)[b-hp7kbqhbb2] {
    z-index: 99999;
}

.searchable-dropdown-button[b-hp7kbqhbb2] {
    width: 100%;
    padding: 12px 40px 12px 16px;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9375rem;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
    color: #212529;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    transition: all 0.2s ease;
    min-height: 48px;
}

.searchable-dropdown-button:hover[b-hp7kbqhbb2] {
    border-color: #adb5bd;
    background: #fafbfc;
}

.searchable-dropdown-button:focus[b-hp7kbqhbb2] {
    outline: none;
    border-color: #007bff;
    background: white;
    box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.1);
}

.searchable-dropdown-button.open[b-hp7kbqhbb2] {
    border-color: #007bff;
}

/* When opening upward */
.searchable-dropdown-wrapper:has(.open-upward) .searchable-dropdown-button.open[b-hp7kbqhbb2] {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* When opening downward */
.searchable-dropdown-wrapper:has(.open-downward) .searchable-dropdown-button.open[b-hp7kbqhbb2] {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.searchable-dropdown-button.disabled[b-hp7kbqhbb2] {
    background-color: #e9ecef;
    cursor: not-allowed;
    opacity: 0.6;
}

.searchable-dropdown-button.disabled:hover[b-hp7kbqhbb2] {
    border-color: #e9ecef;
    background-color: #e9ecef;
}

.dropdown-selected-text[b-hp7kbqhbb2] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dropdown-subtitle[b-hp7kbqhbb2] {
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: normal;
}

.dropdown-arrow[b-hp7kbqhbb2] {
    color: #6b7280;
    font-size: 0.75rem;
    margin-left: 8px;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.searchable-dropdown-button.open .dropdown-arrow[b-hp7kbqhbb2] {
    transform: rotate(0deg);
}

.searchable-dropdown-menu[b-hp7kbqhbb2] {
    position: absolute;
    left: 0;
    right: 0;
    background: white;
    border: 2px solid #007bff;
    z-index: 100000;
    max-height: 400px;
    display: flex;
}

/* Upward opening (default) */
.searchable-dropdown-menu.open-upward[b-hp7kbqhbb2] {
    bottom: 100%;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.25);
    flex-direction: column-reverse;
}

/* Downward opening */
.searchable-dropdown-menu.open-downward[b-hp7kbqhbb2] {
    top: 100%;
    border-top: none;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    flex-direction: column;
}

.dropdown-search-container[b-hp7kbqhbb2] {
    position: relative;
    padding: 12px;
}

.open-upward .dropdown-search-container[b-hp7kbqhbb2] {
    border-top: 1px solid #e9ecef;
}

.open-downward .dropdown-search-container[b-hp7kbqhbb2] {
    border-bottom: 1px solid #e9ecef;
}

.dropdown-search-input[b-hp7kbqhbb2] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e1e5e9;
    border-radius: 6px;
    font-size: 0.875rem;
    background: white;
    font-family: inherit;
    box-sizing: border-box;
    color: #212529;
    transition: all 0.2s ease;
}

.dropdown-search-input:focus[b-hp7kbqhbb2] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.dropdown-list[b-hp7kbqhbb2] {
    max-height: 440px;
    overflow-y: auto;
    padding: 4px 0;
}

.dropdown-item[b-hp7kbqhbb2] {
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.9375rem;
    color: #212529;
    user-select: none;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dropdown-item:hover:not(.disabled)[b-hp7kbqhbb2] {
    background-color: #f8f9fa;
    color: #007bff;
}

.dropdown-item.selected[b-hp7kbqhbb2] {
    background-color: #e7f3ff;
    color: #007bff;
    font-weight: 600;
}

.dropdown-item.disabled[b-hp7kbqhbb2] {
    opacity: 0.5;
    cursor: not-allowed;
    color: #6c757d;
}

.dropdown-item-subtitle[b-hp7kbqhbb2] {
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: normal;
}

.dropdown-no-results[b-hp7kbqhbb2] {
    padding: 16px;
    text-align: center;
    color: #6c757d;
    font-size: 0.875rem;
    font-style: italic;
}

/* Scrollbar styling for dropdown list */
.dropdown-list[b-hp7kbqhbb2]::-webkit-scrollbar {
    width: 6px;
}

.dropdown-list[b-hp7kbqhbb2]::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.dropdown-list[b-hp7kbqhbb2]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.dropdown-list[b-hp7kbqhbb2]::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Responsive styles */
@media (max-width: 768px) {
    .searchable-dropdown-button[b-hp7kbqhbb2] {
        min-height: 44px;
        padding: 10px 36px 10px 14px;
        font-size: 0.875rem;
    }

    .dropdown-arrow[b-hp7kbqhbb2] {
        font-size: 0.7rem;
    }

    .searchable-dropdown-menu[b-hp7kbqhbb2] {
        max-height: 380px;
    }

    .dropdown-list[b-hp7kbqhbb2] {
        max-height: 310px;
    }

    .dropdown-item[b-hp7kbqhbb2] {
        padding: 10px 14px;
        font-size: 0.875rem;
    }
}

@media (max-width: 479px) {
    .searchable-dropdown-button[b-hp7kbqhbb2] {
        min-height: 42px;
        padding: 8px 32px 8px 12px;
    }

    .searchable-dropdown-menu[b-hp7kbqhbb2] {
        max-height: 320px;
    }

    .dropdown-list[b-hp7kbqhbb2] {
        max-height: 250px;
    }
}
/* _content/Hirelab-frontend/Components/UI/SecondaryButton.razor.rz.scp.css */
/* Secondary Button - Already filled with solid color (matches btn-primary) */

.secondary-btn[b-md1wxhy38y] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-decoration: none;
    white-space: nowrap;
    min-height: 40px;
    /* Filled style - solid color background (same as btn-primary) */
    background-color: var(--tenant-secondary-color, #007bff);
    color: white;
    border: none;
}

.secondary-btn:hover:not(:disabled)[b-md1wxhy38y] {
    filter: brightness(0.9);
}

.secondary-btn:focus[b-md1wxhy38y] {
    outline: 2px solid var(--tenant-primary-color, #007bff);
    outline-offset: 2px;
}

.secondary-btn:disabled[b-md1wxhy38y] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Size Variants */
.secondary-btn.btn-sm[b-md1wxhy38y] {
    padding: 6px 12px;
    font-size: 12px;
    min-height: 32px;
}

.secondary-btn.btn-lg[b-md1wxhy38y] {
    padding: 14px 28px;
    font-size: 16px;
    min-height: 48px;
}

/* Full Width */
.secondary-btn.btn-block[b-md1wxhy38y] {
    width: 100%;
    display: flex;
}

/* Icon Styling */
.secondary-btn .btn-icon[b-md1wxhy38y] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.secondary-btn .btn-icon svg[b-md1wxhy38y] {
    width: 16px;
    height: 16px;
}

.secondary-btn.btn-lg .btn-icon svg[b-md1wxhy38y] {
    width: 20px;
    height: 20px;
}

.secondary-btn.btn-sm .btn-icon svg[b-md1wxhy38y] {
    width: 14px;
    height: 14px;
}

/* Loading Spinner */
.btn-spinner[b-md1wxhy38y] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spin-b-md1wxhy38y 0.6s linear infinite;
}

.secondary-btn.btn-lg .btn-spinner[b-md1wxhy38y] {
    width: 20px;
    height: 20px;
    border-width: 3px;
}

.secondary-btn.btn-sm .btn-spinner[b-md1wxhy38y] {
    width: 14px;
    height: 14px;
}

@keyframes spin-b-md1wxhy38y {
    to {
        transform: rotate(360deg);
    }
}

/* Loading State */
.secondary-btn.btn-loading[b-md1wxhy38y] {
    position: relative;
}

/* Responsive text display */
.d-none-xs[b-md1wxhy38y] {
    display: inline;
}

.d-inline-xs[b-md1wxhy38y] {
    display: none;
}

@media (max-width: 576px) {
    .d-none-xs[b-md1wxhy38y] {
        display: none;
    }

    .d-inline-xs[b-md1wxhy38y] {
        display: inline;
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .secondary-btn[b-md1wxhy38y] {
        padding: 8px 16px;
        font-size: 13px;
        min-height: 36px;
    }

    .secondary-btn.btn-lg[b-md1wxhy38y] {
        padding: 12px 24px;
        font-size: 15px;
        min-height: 44px;
    }
}
/* _content/Hirelab-frontend/Components/UI/StatsContainer.razor.rz.scp.css */
/* StatsContainer.razor.css - CSS Isolation */

/* Stats Container */
.stats-container[b-ep3lrlf6dd] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.stat-item[b-ep3lrlf6dd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    text-align: center;
    flex-shrink: 0;
}

.stat-number[b-ep3lrlf6dd] {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    color: #007bff;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Color Variants */
.stat-number.stat-primary[b-ep3lrlf6dd] {
    color: #007bff;
}

.stat-number.stat-success[b-ep3lrlf6dd] {
    color: #28a745;
}

.stat-number.stat-info[b-ep3lrlf6dd] {
    color: #17a2b8;
}

.stat-number.stat-warning[b-ep3lrlf6dd] {
    color: #ffc107;
}

.stat-number.stat-danger[b-ep3lrlf6dd] {
    color: #dc3545;
}

.stat-number.stat-secondary[b-ep3lrlf6dd] {
    color: #6c757d;
}

.stat-icon[b-ep3lrlf6dd] {
    font-size: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.stat-subvalue[b-ep3lrlf6dd] {
    font-size: 0.75rem;
    color: #6c757d;
    line-height: 1.2;
    margin: 2px 0 0 0;
    font-weight: 400;
}

.stat-label[b-ep3lrlf6dd] {
    font-size: 0.875rem;
    color: #6c757d;
    line-height: 1.2;
    margin: 4px 0 0 0;
    white-space: nowrap;
}

.stat-divider[b-ep3lrlf6dd] {
    width: 1px;
    height: 28px;
    background-color: #dee2e6;
    flex-shrink: 0;
}

/* Responsive Design */
@media (max-width: 575px) {
    .stats-container[b-ep3lrlf6dd] {
        gap: 12px;
        padding: 8px;
    }

    .stat-divider[b-ep3lrlf6dd] {
        display: none;
    }

    .stat-item[b-ep3lrlf6dd] {
        flex: 1;
        min-width: calc(33.333% - 12px);
    }

    .stat-number[b-ep3lrlf6dd] {
        font-size: 1.25rem;
    }

    .stat-label[b-ep3lrlf6dd] {
        font-size: 0.75rem;
    }

    .stat-subvalue[b-ep3lrlf6dd] {
        font-size: 0.688rem;
    }
}

@media (max-width: 400px) {
    .stats-container[b-ep3lrlf6dd] {
        padding: 6px;
        gap: 8px;
    }

    .stat-item[b-ep3lrlf6dd] {
        min-width: 0;
    }

    .stat-number[b-ep3lrlf6dd] {
        font-size: 1.125rem;
    }

    .stat-label[b-ep3lrlf6dd] {
        font-size: 0.688rem;
    }

    .stat-subvalue[b-ep3lrlf6dd] {
        font-size: 0.625rem;
    }
}
/* _content/Hirelab-frontend/Components/UI/StatusBadge.razor.rz.scp.css */
/* Status Badge Component Styles */

.status-badge[b-3re81xpxow] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    line-height: 1.2;
}

/* Position Status Colors */
.status-badge.status-active[b-3re81xpxow] {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #86efac;
}

/* Light green for positions with no accepted candidates yet (e.g., "0/1") */
.status-badge.status-light-green[b-3re81xpxow] {
    background: #f0fdf4;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.status-badge.status-closed[b-3re81xpxow] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.status-badge.status-draft[b-3re81xpxow] {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}

.status-badge.status-reviewing[b-3re81xpxow] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde047;
}

.status-badge.status-filled[b-3re81xpxow] {
    background: #ffffff;
    color: #166534;
    border: 1px solid #166534;
}

.status-badge.status-default[b-3re81xpxow] {
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #d1d5db;
}

/* Application Status Colors */
.status-badge.status-invited[b-3re81xpxow] {
    background: #dbeafe;
    color: #1e40af;
    border: 1px solid #93c5fd;
}

.status-badge.status-inprogress[b-3re81xpxow] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde047;
}

.status-badge.status-interviewed[b-3re81xpxow] {
    background: #e0e7ff;
    color: #4338ca;
    border: 1px solid #a5b4fc;
}

.status-badge.status-reviewed[b-3re81xpxow] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde047;
}

/* Pending Approval - Light Green */
.status-badge.status-approved[b-3re81xpxow] {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #6ee7b7;
    font-weight: 600;
}

/* Pending Rejection - Light Red/Pink */
.status-badge.status-denied[b-3re81xpxow] {
    background: #fed7d7;
    color: #c53030;
    border: 1px solid #fc8181;
    font-weight: 600;
}

/* Uncertain - Yellow/Amber */
.status-badge.status-uncertain[b-3re81xpxow] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fbbf24;
    font-weight: 600;
}

/* Sent to Client (Final Approved) - Bright Green */
.status-badge.status-finalapproved[b-3re81xpxow] {
    background: #10b981;
    color: #ffffff;
    border: 1px solid #059669;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(16, 185, 129, 0.3);
}

/* Rejected (Final) - Bright/Obvious Red */
.status-badge.status-finaldenied[b-3re81xpxow],
.status-badge.status-finalrejected[b-3re81xpxow] {
    background: #ef4444;
    color: #ffffff;
    border: 1px solid #dc2626;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(239, 68, 68, 0.3);
}

/* Active/Inactive (Enabled/Disabled) Status Colors */
.status-badge.active[b-3re81xpxow] {
    background: #10b981;
    color: #ffffff;
    border: 1px solid #059669;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(16, 185, 129, 0.3);
}

.status-badge.inactive[b-3re81xpxow] {
    background: #ef4444;
    color: #ffffff;
    border: 1px solid #dc2626;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(239, 68, 68, 0.3);
}

/* Candidate Status Colors */
.status-badge.status-inactive[b-3re81xpxow] {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}

.status-badge.status-suspended[b-3re81xpxow] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

/* Client Status Colors */
/* Pending - Gray */
.status-badge.status-secondary[b-3re81xpxow] {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}

/* Notified - Blue */
.status-badge.status-info[b-3re81xpxow] {
    background: #dbeafe;
    color: #1e40af;
    border: 1px solid #93c5fd;
    font-weight: 600;
}

/* Reviewed - Purple */
.status-badge.status-primary[b-3re81xpxow] {
    background: #e0e7ff;
    color: #4338ca;
    border: 1px solid #a5b4fc;
    font-weight: 600;
}

/* Accepted - Bright Green */
.status-badge.status-success[b-3re81xpxow] {
    background: #10b981;
    color: #ffffff;
    border: 1px solid #059669;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(16, 185, 129, 0.3);
}

/* Rejected - Bright Red */
.status-badge.status-danger[b-3re81xpxow] {
    background: #ef4444;
    color: #ffffff;
    border: 1px solid #dc2626;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(239, 68, 68, 0.3);
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .status-badge[b-3re81xpxow] {
        font-size: 10px;
        padding: 3px 8px;
    }
}
/* _content/Hirelab-frontend/Components/UI/ToastNotification.razor.rz.scp.css */
/* Toast Container - Fixed at top right */
.toast-container[b-lul2d2uq7k] {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    pointer-events: none;
}

/* Toast Base Styles */
.toast[b-lul2d2uq7k] {
    min-width: 300px;
    max-width: 500px;
    padding: 16px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: flex-start;
    gap: 12px;
    pointer-events: auto;
    animation: slideIn-b-lul2d2uq7k 0.3s ease-out;
    background: white;
}

@keyframes slideIn-b-lul2d2uq7k {
    from {
        transform: translateX(400px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Toast Icon */
.toast-icon[b-lul2d2uq7k] {
    font-size: 24px;
    font-weight: bold;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

/* Toast Content */
.toast-content[b-lul2d2uq7k] {
    flex: 1;
    min-width: 0;
}

.toast-title[b-lul2d2uq7k] {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 4px;
}

.toast-message[b-lul2d2uq7k] {
    font-size: 14px;
    line-height: 1.4;
    word-wrap: break-word;
}

/* Toast Close Button */
.toast-close[b-lul2d2uq7k] {
    background: none;
    border: none;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: background-color 0.2s;
    flex-shrink: 0;
    color: inherit;
    opacity: 0.6;
}

.toast-close:hover[b-lul2d2uq7k] {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.1);
}

/* Success Toast */
.toast-success[b-lul2d2uq7k] {
    background: #f0fdf4;
    border-left: 4px solid #22c55e;
}

.toast-success .toast-icon[b-lul2d2uq7k] {
    background: #dcfce7;
    color: #16a34a;
}

.toast-success .toast-title[b-lul2d2uq7k] {
    color: #166534;
}

.toast-success .toast-message[b-lul2d2uq7k] {
    color: #15803d;
}

/* Error Toast */
.toast-error[b-lul2d2uq7k] {
    background: #fef2f2;
    border-left: 4px solid #ef4444;
}

.toast-error .toast-icon[b-lul2d2uq7k] {
    background: #fee2e2;
    color: #dc2626;
}

.toast-error .toast-title[b-lul2d2uq7k] {
    color: #991b1b;
}

.toast-error .toast-message[b-lul2d2uq7k] {
    color: #b91c1c;
}

/* Warning Toast */
.toast-warning[b-lul2d2uq7k] {
    background: #fffbeb;
    border-left: 4px solid #f59e0b;
}

.toast-warning .toast-icon[b-lul2d2uq7k] {
    background: #fef3c7;
    color: #d97706;
}

.toast-warning .toast-title[b-lul2d2uq7k] {
    color: #92400e;
}

.toast-warning .toast-message[b-lul2d2uq7k] {
    color: #b45309;
}

/* Info Toast */
.toast-info[b-lul2d2uq7k] {
    background: #eff6ff;
    border-left: 4px solid #3b82f6;
}

.toast-info .toast-icon[b-lul2d2uq7k] {
    background: #dbeafe;
    color: #2563eb;
}

.toast-info .toast-title[b-lul2d2uq7k] {
    color: #1e40af;
}

.toast-info .toast-message[b-lul2d2uq7k] {
    color: #1d4ed8;
}
/* _content/Hirelab-frontend/Components/UI/Toggle.razor.rz.scp.css */
.toggle-container[b-5ip6zo729k] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.toggle-wrapper[b-5ip6zo729k] {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 24px;
    cursor: pointer;
    flex-shrink: 0;
}

.toggle-input[b-5ip6zo729k] {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.toggle-slider[b-5ip6zo729k] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #cbd5e0;
    transition: all 0.3s ease;
    border-radius: 24px;
}

.toggle-slider[b-5ip6zo729k]::before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: all 0.3s ease;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.toggle-input:checked + .toggle-slider[b-5ip6zo729k] {
    background-color: var(--tenant-secondary-color, #007bff);
}

.toggle-input:checked + .toggle-slider[b-5ip6zo729k]::before {
    transform: translateX(24px);
}

.toggle-input:disabled + .toggle-slider[b-5ip6zo729k] {
    opacity: 0.5;
    cursor: not-allowed;
}

.toggle-label[b-5ip6zo729k] {
    font-size: 14px;
    font-weight: 500;
    color: #495057;
    user-select: none;
}
/* _content/Hirelab-frontend/Components/UI/UploadInterviewModal.razor.rz.scp.css */
/* Overlay */
.upload-interview-modal-overlay[b-n0ub3n4urj] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
    animation: fadeIn-b-n0ub3n4urj 0.2s ease-out;
}

@keyframes fadeIn-b-n0ub3n4urj {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Modal Container */
.upload-interview-modal-container[b-n0ub3n4urj] {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 800px;
    width: 100%;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-n0ub3n4urj 0.3s ease-out;
}

@keyframes slideUp-b-n0ub3n4urj {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Header */
.upload-interview-modal-header[b-n0ub3n4urj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 28px 32px;
    border-bottom: 1px solid #e5e7eb;
    gap: 20px;
}

.header-content[b-n0ub3n4urj] {
    flex: 1;
}

.modal-title[b-n0ub3n4urj] {
    font-size: 24px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 6px 0;
    line-height: 1.2;
}

.candidate-subtitle[b-n0ub3n4urj] {
    font-size: 16px;
    font-weight: 500;
    color: #6b7280;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.position-separator[b-n0ub3n4urj] {
    color: #d1d5db;
}

.position-title[b-n0ub3n4urj] {
    color: #4f46e5;
    font-weight: 600;
}

.legacy-badge[b-n0ub3n4urj] {
    display: inline-block;
    padding: 4px 10px;
    background: #fef3c7;
    color: #d97706;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.modal-close-btn[b-n0ub3n4urj] {
    background: transparent;
    border: none;
    color: #6b7280;
    cursor: pointer;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    transition: all 0.2s;
    flex-shrink: 0;
}

.modal-close-btn:hover[b-n0ub3n4urj] {
    background: #f3f4f6;
    color: #111827;
}

/* Body */
.upload-interview-modal-body[b-n0ub3n4urj] {
    padding: 32px;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

/* Loading State */
.loading-state[b-n0ub3n4urj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 16px;
}

.loading-spinner[b-n0ub3n4urj] {
    width: 40px;
    height: 40px;
    border: 4px solid #e5e7eb;
    border-top-color: #4f46e5;
    border-radius: 50%;
    animation: spin-b-n0ub3n4urj 0.8s linear infinite;
}

@keyframes spin-b-n0ub3n4urj {
    to {
        transform: rotate(360deg);
    }
}

.loading-state p[b-n0ub3n4urj] {
    color: #6b7280;
    font-size: 16px;
    margin: 0;
}

/* Uploading State */
.uploading-state[b-n0ub3n4urj] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
}

.upload-progress[b-n0ub3n4urj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.progress-circle[b-n0ub3n4urj] {
    position: relative;
    width: 80px;
    height: 80px;
}

.progress-ring[b-n0ub3n4urj] {
    transform: rotate(-90deg);
}

.progress-ring-circle-active[b-n0ub3n4urj] {
    transition: stroke-dashoffset 0.3s ease;
    stroke: #4f46e5;
}

.progress-text[b-n0ub3n4urj] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px;
    font-weight: 700;
    color: #4f46e5;
}

.upload-progress h3[b-n0ub3n4urj] {
    font-size: 20px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.upload-progress p[b-n0ub3n4urj] {
    font-size: 14px;
    color: #6b7280;
    margin: 0;
}

/* Step Section */
.step-section[b-n0ub3n4urj] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}

.step-title[b-n0ub3n4urj] {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

/* Search Section */
.search-section[b-n0ub3n4urj] {
    width: 100%;
}

.search-input-wrapper[b-n0ub3n4urj] {
    position: relative;
    width: 100%;
}

.search-icon[b-n0ub3n4urj] {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #9ca3af;
    pointer-events: none;
}

.search-input[b-n0ub3n4urj] {
    width: 100%;
    padding: 12px 16px 12px 44px;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    font-size: 15px;
    color: #111827;
    background: #ffffff;
    transition: all 0.2s;
}

.search-input:focus[b-n0ub3n4urj] {
    outline: none;
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.search-input[b-n0ub3n4urj]::placeholder {
    color: #9ca3af;
}

/* Templates List */
.templates-list[b-n0ub3n4urj] {
    max-height: 400px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 4px;
}

.template-card[b-n0ub3n4urj] {
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s;
    background: #ffffff;
    width: 100%;
    box-sizing: border-box;
}

.template-card.selected[b-n0ub3n4urj] {
    border-color: #4f46e5;
    background: #eef2ff;
}

.template-card:hover[b-n0ub3n4urj] {
    border-color: #4f46e5;
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.15);
    transform: translateY(-2px);
}

.template-card-header[b-n0ub3n4urj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.template-name[b-n0ub3n4urj] {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.question-count-badge[b-n0ub3n4urj] {
    background: #4f46e5;
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

.template-description[b-n0ub3n4urj] {
    font-size: 14px;
    color: #6b7280;
    margin: 8px 0;
    line-height: 1.5;
}

.department-badge[b-n0ub3n4urj] {
    display: inline-block;
    background: #f3f4f6;
    color: #374151;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
}

.empty-state[b-n0ub3n4urj] {
    text-align: center;
    padding: 40px 20px;
    color: #9ca3af;
}

/* Selected Template Header */
.selected-template-header[b-n0ub3n4urj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}

.selected-template-name[b-n0ub3n4urj] {
    font-size: 14px;
    color: #4f46e5;
    font-weight: 500;
    margin: 4px 0 0 0;
}

.btn-change-template[b-n0ub3n4urj] {
    background: #f3f4f6;
    color: #374151;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}

.btn-change-template:hover[b-n0ub3n4urj] {
    background: #e5e7eb;
    color: #111827;
}

/* Error Message */
.error-message[b-n0ub3n4urj] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 12px 16px;
    color: #dc2626;
    font-size: 14px;
    margin-bottom: 16px;
}

/* Questions Upload List */
.questions-upload-list[b-n0ub3n4urj] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 400px;
    overflow-y: auto;
    padding: 4px;
}

.question-upload-card[b-n0ub3n4urj] {
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    background: #ffffff;
    transition: all 0.2s;
    width: 100%;
    box-sizing: border-box;
}

.question-upload-card:hover[b-n0ub3n4urj] {
    border-color: #d1d5db;
}

.question-header[b-n0ub3n4urj] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 12px;
}

.question-number[b-n0ub3n4urj] {
    background: #4f46e5;
    color: white;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
}

.question-text[b-n0ub3n4urj] {
    font-size: 15px;
    color: #111827;
    font-weight: 500;
    line-height: 1.5;
    margin: 0;
    padding-top: 4px;
}

/* Upload Section */
.upload-section[b-n0ub3n4urj] {
    margin-top: 12px;
}

.file-input-hidden[b-n0ub3n4urj] {
    display: none;
}

.file-input-label[b-n0ub3n4urj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 20px;
    background: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 10px;
    color: #4f46e5;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.file-input-label:hover[b-n0ub3n4urj] {
    background: #f3f4f6;
    border-color: #4f46e5;
}

.upload-icon[b-n0ub3n4urj] {
    flex-shrink: 0;
}

.file-uploaded[b-n0ub3n4urj] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #f0fdf4;
    border: 2px solid #86efac;
    border-radius: 10px;
    color: #16a34a;
    font-size: 14px;
    font-weight: 500;
}

.check-icon[b-n0ub3n4urj] {
    flex-shrink: 0;
    color: #16a34a;
}

.btn-remove[b-n0ub3n4urj] {
    margin-left: auto;
    background: transparent;
    border: none;
    color: #ef4444;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    transition: all 0.2s;
}

.btn-remove:hover[b-n0ub3n4urj] {
    background: #fee2e2;
}

/* Footer */
.upload-interview-modal-footer[b-n0ub3n4urj] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    padding: 20px 32px;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

.btn-cancel[b-n0ub3n4urj] {
    background: transparent;
    border: 2px solid #d1d5db;
    color: #374151;
    padding: 10px 24px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-cancel:hover[b-n0ub3n4urj] {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.btn-upload[b-n0ub3n4urj] {
    background: #4f46e5;
    border: none;
    color: white;
    padding: 10px 24px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-upload:hover:not(:disabled)[b-n0ub3n4urj] {
    background: #4338ca;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.3);
}

.btn-upload:disabled[b-n0ub3n4urj] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Scrollbar Styling */
.templates-list[b-n0ub3n4urj]::-webkit-scrollbar,
.questions-upload-list[b-n0ub3n4urj]::-webkit-scrollbar {
    width: 8px;
}

.templates-list[b-n0ub3n4urj]::-webkit-scrollbar-track,
.questions-upload-list[b-n0ub3n4urj]::-webkit-scrollbar-track {
    background: #f3f4f6;
    border-radius: 4px;
}

.templates-list[b-n0ub3n4urj]::-webkit-scrollbar-thumb,
.questions-upload-list[b-n0ub3n4urj]::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 4px;
}

.templates-list[b-n0ub3n4urj]::-webkit-scrollbar-thumb:hover,
.questions-upload-list[b-n0ub3n4urj]::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

/* Responsive */
@media (max-width: 768px) {
    .upload-interview-modal-container[b-n0ub3n4urj] {
        max-width: 95vw;
        max-height: 90vh;
    }

    .upload-interview-modal-header[b-n0ub3n4urj],
    .upload-interview-modal-body[b-n0ub3n4urj],
    .upload-interview-modal-footer[b-n0ub3n4urj] {
        padding: 20px;
    }

    .modal-title[b-n0ub3n4urj] {
        font-size: 20px;
    }

    .selected-template-header[b-n0ub3n4urj] {
        flex-direction: column;
    }

    .btn-change-template[b-n0ub3n4urj] {
        align-self: flex-start;
    }
}