/* /Components/Layout/CareersLayout.razor.rz.scp.css */
/* Careers Layout - Sleek, minimal design */

.careers-layout[b-3ti3nh1s7b] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #faf9f7 0%, #f5f3ef 100%);
}

/* ===== HEADER ===== */
.careers-header[b-3ti3nh1s7b] {
    background: #004F3C;
    padding: 0 2rem;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 20px rgba(0, 79, 60, 0.15);
}

.header-content[b-3ti3nh1s7b] {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 70px;
}

.logo-link[b-3ti3nh1s7b] {
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.logo-link:hover[b-3ti3nh1s7b] {
    opacity: 0.9;
}

.header-logo[b-3ti3nh1s7b] {
    height: 40px;
    width: auto;
}

.header-nav[b-3ti3nh1s7b] {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.nav-link[b-3ti3nh1s7b] {
    color: #d3b890;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    padding: 0.5rem 0;
    position: relative;
    transition: color 0.2s ease;
}

.nav-link[b-3ti3nh1s7b]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: #d3b890;
    transition: width 0.3s ease;
}

.nav-link:hover[b-3ti3nh1s7b] {
    color: #ffffff;
}

.nav-link:hover[b-3ti3nh1s7b]::after {
    width: 100%;
}

/* ===== MAIN CONTENT ===== */
.careers-main[b-3ti3nh1s7b] {
    flex: 1;
    width: 100%;
}

/* ===== FOOTER ===== */
.careers-footer[b-3ti3nh1s7b] {
    background: #004F3C;
    color: #ffffff;
    padding: 4rem 2rem 2rem;
    margin-top: auto;
}

.footer-content[b-3ti3nh1s7b] {
    max-width: 1200px;
    margin: 0 auto;
}

.footer-brand[b-3ti3nh1s7b] {
    text-align: center;
    margin-bottom: 3rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(211, 184, 144, 0.2);
}

.footer-logo[b-3ti3nh1s7b] {
    height: 60px;
    width: auto;
    margin-bottom: 1rem;
}

.footer-tagline[b-3ti3nh1s7b] {
    color: #d3b890;
    font-size: 1rem;
    font-style: italic;
    margin: 0;
    opacity: 0.9;
}

.footer-links[b-3ti3nh1s7b] {
    display: flex;
    justify-content: center;
    gap: 6rem;
    margin-bottom: 3rem;
}

.footer-section h4[b-3ti3nh1s7b] {
    color: #d3b890;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin: 0 0 1rem 0;
    font-weight: 600;
}

.footer-section a[b-3ti3nh1s7b] {
    display: block;
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    font-size: 0.9rem;
    padding: 0.4rem 0;
    transition: color 0.2s ease;
}

.footer-section a:hover[b-3ti3nh1s7b] {
    color: #d3b890;
}

.footer-bottom[b-3ti3nh1s7b] {
    text-align: center;
    padding-top: 2rem;
    border-top: 1px solid rgba(211, 184, 144, 0.2);
}

.footer-bottom p[b-3ti3nh1s7b] {
    margin: 0;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.6);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .careers-header[b-3ti3nh1s7b] {
        padding: 0 1rem;
    }

    .header-content[b-3ti3nh1s7b] {
        height: 60px;
    }

    .header-logo[b-3ti3nh1s7b] {
        height: 32px;
    }

    .header-nav[b-3ti3nh1s7b] {
        gap: 1rem;
    }

    .nav-link[b-3ti3nh1s7b] {
        font-size: 0.8rem;
    }

    .careers-footer[b-3ti3nh1s7b] {
        padding: 3rem 1.5rem 1.5rem;
    }

    .footer-links[b-3ti3nh1s7b] {
        flex-direction: column;
        gap: 2rem;
        align-items: center;
        text-align: center;
    }

    .footer-brand[b-3ti3nh1s7b] {
        margin-bottom: 2rem;
        padding-bottom: 1.5rem;
    }
}

@media (max-width: 480px) {
    .nav-link:last-child[b-3ti3nh1s7b] {
        display: none; /* Hide "About Us" on very small screens */
    }
}
/* /Components/Pages/ApplicationUsers.razor.rz.scp.css */
/* Application Users Page Styles */
.users-container[b-6a7xvnd64h] {
    max-width: 1600px;
    margin: 0 auto;
    font-family: 'ABCWhyte', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    padding: 0px;
}

/* Page Header */
.page-header[b-6a7xvnd64h] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
    padding: 20px;
    background: white;
    border-radius: 20px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    min-width: 350px;
}

.header-content h1[b-6a7xvnd64h] {
    margin: 0 0 8px 0;
    color: #111827;
    font-weight: 500;
    font-size: 32px;
}

.header-content p[b-6a7xvnd64h] {
    color: #6b7280;
    margin: 0;
    font-size: 16px;
}

.header-actions[b-6a7xvnd64h] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-shrink: 0;
}

.action-btn-primary[b-6a7xvnd64h] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.2) !important;
    transition: all 0.2s ease !important;
    min-height: 44px !important;
}

.action-btn-primary:hover[b-6a7xvnd64h] {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 79, 60, 0.3) !important;
}

.action-btn-secondary[b-6a7xvnd64h] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px 20px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    min-height: 44px !important;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.2) !important;
}

.action-btn-secondary:hover[b-6a7xvnd64h] {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 79, 60, 0.3) !important;
}

/* Mobile-only add button */
.action-btn-mobile[b-6a7xvnd64h] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 50% !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    min-width: 44px !important;
    display: none !important;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.3) !important;
}

.action-btn-mobile:hover[b-6a7xvnd64h] {
    box-shadow: 0 6px 20px rgba(0, 79, 60, 0.4) !important;
}


/* Toolbar */
.toolbar-section[b-6a7xvnd64h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding: 16px 24px;
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    flex-wrap: wrap;
    gap: 12px;
}

.toolbar-left[b-6a7xvnd64h] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.toolbar-right[b-6a7xvnd64h] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* User Stats */
.user-stats[b-6a7xvnd64h] {
    display: flex;
    gap: 8px;
}

.stat-badge[b-6a7xvnd64h] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    background: #f3f4f6;
    color: #6b7280;
}

.stat-badge.active[b-6a7xvnd64h] {
    background: #dcfce7;
    color: #166534;
}

.stat-badge[b-6a7xvnd64h]  .rz-icon {
    font-size: 14px;
}

/* Search */
.search-container[b-6a7xvnd64h] {
    position: relative;
    display: flex;
    align-items: center;
}

.search-container[b-6a7xvnd64h]  .search-input {
    padding-left: 36px;
    padding-right: 12px;
    width: 280px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    transition: all 0.2s ease;
}

.search-container[b-6a7xvnd64h]  .search-input:focus {
    border-color: #004F3C;
    box-shadow: 0 0 0 3px rgba(0, 79, 60, 0.1);
}

.search-container .search-icon[b-6a7xvnd64h] {
    position: absolute;
    left: 10px;
    color: #9ca3af;
    font-size: 20px;
    pointer-events: none;
}

/* Content Area */
.content-area[b-6a7xvnd64h] {
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    padding: 20px;
    min-height: 400px;
}

/* Users Grid */
.users-grid[b-6a7xvnd64h] {
    border-radius: 12px;
    overflow: hidden;
}

.users-grid[b-6a7xvnd64h]  .rz-data-grid {
    border: none;
}

.users-grid[b-6a7xvnd64h]  .rz-grid-table thead th {
    background: #f9fafb;
    font-weight: 600;
    color: #374151;
    border-bottom: 2px solid #e5e7eb;
}

.users-grid[b-6a7xvnd64h]  .rz-grid-table tbody tr:hover {
    background: #f9fafb;
}

.users-grid[b-6a7xvnd64h]  .rz-column-title-content {
    white-space: normal !important;
    word-break: normal !important;
}

/* Action Split Button */
.action-split-btn[b-6a7xvnd64h] {
    width: 100%;
    color: var(--rz-secondary) !important;
    border: 1px solid #d3b890 !important;
    border-radius: 8px !important;
}

.action-split-btn:hover[b-6a7xvnd64h] {
    background: #f9fafb !important;
}

/* Delete Button */
.users-grid[b-6a7xvnd64h]  .rz-button.rz-button-danger {
    border-radius: 8px;
    transition: all 0.2s ease;
}

.users-grid[b-6a7xvnd64h]  .rz-button.rz-button-danger:hover {
    transform: scale(1.05);
}

/* Responsive Styles */
@media (max-width: 768px) {
    .users-container[b-6a7xvnd64h] {
        padding: 0px;
    }

    /* Remove Radzen default padding on mobile */
    .users-container[b-6a7xvnd64h]  .rz-px-4,
    .users-container[b-6a7xvnd64h]  .rz-pl-4,
    .users-container[b-6a7xvnd64h]  .rz-pr-4 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .page-header[b-6a7xvnd64h] {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
        padding: 16px;
    }

    .header-actions[b-6a7xvnd64h] {
        position: absolute;
        top: 16px;
        right: 16px;
    }

    .page-header[b-6a7xvnd64h] {
        position: relative;
    }

    .action-btn-mobile[b-6a7xvnd64h] {
        display: inline-flex !important;
    }

    .toolbar-section[b-6a7xvnd64h] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }

    .toolbar-left[b-6a7xvnd64h],
    .toolbar-right[b-6a7xvnd64h] {
        width: 100%;
    }

    .search-container[b-6a7xvnd64h] {
        width: 100%;
    }

    .search-container[b-6a7xvnd64h]  .search-input {
        width: 100%;
    }

    .content-area[b-6a7xvnd64h] {
        padding: 12px;
        border-radius: 12px;
    }

    .users-grid[b-6a7xvnd64h]  .rz-grid-table {
        font-size: 12px;
    }

    .action-split-btn[b-6a7xvnd64h] {
        font-size: 10px !important;
        padding: 4px 8px !important;
        min-height: 28px !important;
    }

    .action-split-btn[b-6a7xvnd64h]  .rz-button {
        padding: 4px 8px !important;
        min-height: 28px !important;
    }

    /* Hide "Actions" text on mobile, show only icon */
    .action-split-btn[b-6a7xvnd64h]  .rz-button-text {
        display: none !important;
    }

    .action-split-btn[b-6a7xvnd64h]  .rz-button-icon-left {
        margin-right: 0 !important;
    }

    /* Fix dropdown menu on mobile */
    .action-split-btn[b-6a7xvnd64h]  .rz-menu {
        min-width: 200px !important;
        font-size: 14px !important;
    }

    .action-split-btn[b-6a7xvnd64h]  .rz-menu-item {
        padding: 10px 16px !important;
        font-size: 14px !important;
        white-space: nowrap !important;
    }

    .action-split-btn[b-6a7xvnd64h]  .rz-menuitem-text {
        font-size: 14px !important;
        display: inline-block !important;
    }

    /* Narrow Actions column on mobile (icon only) */
    .users-grid[b-6a7xvnd64h]  .rz-frozen-cell:first-child,
    .users-grid[b-6a7xvnd64h]  th:first-child {
        min-width: 70px !important;
        width: 70px !important;
    }

    .hide-on-mobile[b-6a7xvnd64h] {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .page-header[b-6a7xvnd64h] {
        padding: 12px;
        border-radius: 12px;
    }

    .header-content h1[b-6a7xvnd64h] {
        font-size: 24px;
    }

    .header-content p[b-6a7xvnd64h] {
        font-size: 14px;
    }

    .toolbar-section[b-6a7xvnd64h] {
        border-radius: 12px;
    }

    .stat-badge[b-6a7xvnd64h] {
        font-size: 12px;
        padding: 4px 10px;
    }

    .content-area[b-6a7xvnd64h] {
        padding: 8px;
    }
}

/* Animation for content on load */
@keyframes fadeInUp-b-6a7xvnd64h {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.page-header[b-6a7xvnd64h] {
    animation: fadeInUp-b-6a7xvnd64h 0.4s ease forwards;
}

.toolbar-section[b-6a7xvnd64h] {
    animation: fadeInUp-b-6a7xvnd64h 0.4s ease forwards;
    animation-delay: 0.1s;
}

.content-area[b-6a7xvnd64h] {
    animation: fadeInUp-b-6a7xvnd64h 0.4s ease forwards;
    animation-delay: 0.2s;
}
/* /Components/Pages/AssetLibrary/AssetLibrary.razor.rz.scp.css */
/* Asset Library Styles */
  /* Override Radzen padding on parent containers */
.rz-px-4[b-lxtwxlv85u], .rz-pr-4[b-lxtwxlv85u], .rz-pl-4[b-lxtwxlv85u], .rz-p-4[b-lxtwxlv85u] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Also handle any y-axis padding if needed */
.rz-py-4[b-lxtwxlv85u], .rz-pt-4[b-lxtwxlv85u], .rz-pb-4[b-lxtwxlv85u] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
/* Add these to specifically target the top padding classes */
.rz-pt-2[b-lxtwxlv85u], .rz-pt-md-4[b-lxtwxlv85u], .rz-pt-lg-6[b-lxtwxlv85u] {
    padding-top: 0 !important;
}
.asset-library-container[b-lxtwxlv85u] {
    max-width: 1600px;
    margin: 0 auto;
    font-family: 'ABCWhyte', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    padding: 0px;
}

/* Page Header */
.page-header[b-lxtwxlv85u] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
    padding: 20px;
    background: white;
    border-radius: 20px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    min-width: 350px;
}

.header-content h1[b-lxtwxlv85u] {
    margin: 0 0 8px 0;
    color: #111827;
    font-weight: 500;
    font-size: 32px;
}

.header-content p[b-lxtwxlv85u] {
    color: #6b7280;
    margin: 0;
    font-size: 16px;
}

.header-actions[b-lxtwxlv85u] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-shrink: 0;
}

.action-btn-primary[b-lxtwxlv85u] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.2) !important;
    transition: all 0.2s ease !important;
    min-height: 44px !important;
}

.action-btn-primary:hover[b-lxtwxlv85u] {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 79, 60, 0.3) !important;
}

.action-btn-secondary[b-lxtwxlv85u] {
    background: white !important;
    color: #6b7280 !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 12px 20px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    min-height: 44px !important;
}

.action-btn-secondary:hover[b-lxtwxlv85u] {
    background: #f9fafb !important;
    border-color: #004F3C !important;
    color: #004F3C !important;
}

.activity-btn[b-lxtwxlv85u] {
    background: white !important;
    color: #6b7280 !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 12px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    min-height: 44px !important;
    min-width: 44px !important;
}

.activity-btn:hover[b-lxtwxlv85u] {
    background: #f9fafb !important;
    border-color: #8b5cf6 !important;
    color: #8b5cf6 !important;
}

.activity-btn .rzi[b-lxtwxlv85u] {
    font-size: 20px !important;
}

/* Toolbar */
.toolbar-section[b-lxtwxlv85u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding: 16px 24px;
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    flex-wrap: wrap;
    gap: 12px;
}

.toolbar-left[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.toolbar-right[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Breadcrumb */
.breadcrumb-nav[b-lxtwxlv85u] {
    min-width: 0;
}

.custom-breadcrumb[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}

.breadcrumb-item[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    color: var(--rz-text-secondary-color);
    padding: 4px 8px;
    border-radius: 6px;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.breadcrumb-item:hover[b-lxtwxlv85u] {
    color: var(--rz-primary);
    background: var(--rz-base-100);
}

.breadcrumb-item[b-lxtwxlv85u]  .rz-icon {
    font-size: 18px;
}

.breadcrumb-separator[b-lxtwxlv85u] {
    color: var(--rz-text-tertiary-color);
    font-weight: 300;
}

/* Folder Asset Count Badge (shown when drilled into a folder) */
.folder-asset-count-badge[b-lxtwxlv85u] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    margin-left: 12px;
    white-space: nowrap;
}

/* Search */
.search-container[b-lxtwxlv85u] {
    position: relative;
    display: flex;
    align-items: center;
}

.search-container[b-lxtwxlv85u]  .search-input {
    padding-left: 36px;
    padding-right: 36px;
    width: 280px;
}

.search-container .search-icon[b-lxtwxlv85u] {
    position: absolute;
    left: 10px;
    color: var(--rz-text-tertiary-color);
    font-size: 20px;
    pointer-events: none;
}

.search-clear-btn[b-lxtwxlv85u] {
    position: absolute;
    right: 4px;
}

/* Filters */
.media-filter[b-lxtwxlv85u] {
    min-width: 140px;
}

.sort-dropdown[b-lxtwxlv85u] {
    min-width: 180px;
}

.view-toggle[b-lxtwxlv85u] {
    border-radius: 6px;
}

/* Search Indicator */
.search-indicator[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 20px;
    color: var(--rz-text-secondary-color);
}

/* Content Area */
.content-area[b-lxtwxlv85u] {
    display: flex;
    gap: 20px;
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    padding: 20px;
    min-height: 400px;
}

.content-area.with-panel .assets-container[b-lxtwxlv85u] {
    flex: 1;
    min-width: 0;
}

.assets-container[b-lxtwxlv85u] {
    flex: 1;
}

/* Grid View */
.asset-grid[b-lxtwxlv85u] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}

/* Asset Cards */
.asset-card[b-lxtwxlv85u] {
    position: relative;
    background: var(--rz-base-background-color);
    border: 1px solid var(--rz-grid-cell-border);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s ease;
}

.asset-card:hover[b-lxtwxlv85u] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.asset-card.selected[b-lxtwxlv85u] {
    border-color: var(--rz-primary);
    box-shadow: 0 0 0 2px var(--rz-primary-lighter);
}

/* Card Thumbnail */
.card-thumbnail[b-lxtwxlv85u] {
    position: relative;
    aspect-ratio: 1;
    background: var(--rz-base-50);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.card-thumbnail img[b-lxtwxlv85u] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    padding: 8px;
    box-sizing: border-box;
}

.card-thumbnail .thumbnail-placeholder[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: var(--rz-text-tertiary-color);
}

.card-thumbnail .thumbnail-placeholder[b-lxtwxlv85u]  .rz-icon {
    font-size: 48px;
}

.folder-card .folder-icon[b-lxtwxlv85u] {
    background: var(--rz-primary-lighter);
}

.folder-card .folder-icon[b-lxtwxlv85u]  .rz-icon {
    font-size: 56px;
    color: var(--rz-primary);
}

/* Folder Mosaic Preview */
.folder-card .folder-mosaic[b-lxtwxlv85u] {
    background: var(--rz-base-100);
    position: relative;
}

.folder-mosaic-grid[b-lxtwxlv85u] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 2px;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.mosaic-cell[b-lxtwxlv85u] {
    overflow: hidden;
    background: var(--rz-base-50);
    display: flex;
    align-items: center;
    justify-content: center;
}

.mosaic-cell img[b-lxtwxlv85u] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.folder-card:hover .mosaic-cell img[b-lxtwxlv85u] {
    transform: scale(1.05);
}

.mosaic-cell.mosaic-empty[b-lxtwxlv85u] {
    background: var(--rz-base-100);
}

.mosaic-cell.mosaic-empty[b-lxtwxlv85u]  .rz-icon {
    font-size: 24px;
    color: var(--rz-text-tertiary-color);
    opacity: 0.5;
}

/* Folder icon overlay on mosaic */
.folder-mosaic-overlay[b-lxtwxlv85u] {
    position: absolute;
    bottom: 8px;
    left: 8px;
    width: 32px;
    height: 32px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.folder-mosaic-overlay[b-lxtwxlv85u]  .rz-icon {
    font-size: 20px;
    color: var(--rz-primary);
}

/* Folder Count Badge */
.folder-count-badge[b-lxtwxlv85u] {
    position: absolute;
    bottom: 8px;
    right: 8px;
    min-width: 24px;
    height: 24px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    background: var(--rz-primary);
    color: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Media Badge */
.media-badge[b-lxtwxlv85u] {
    position: absolute;
    bottom: 8px;
    left: 8px;
    padding: 2px 8px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.6);
    color: white;
}

.media-badge.image[b-lxtwxlv85u] {
    background: var(--rz-info);
}

.media-badge.video[b-lxtwxlv85u] {
    background: var(--rz-danger);
}

.media-badge.document[b-lxtwxlv85u] {
    background: var(--rz-success);
}

.media-badge.folder[b-lxtwxlv85u] {
    background: #f9a825;
}

/* Card Content */
.card-content[b-lxtwxlv85u] {
    padding: 12px;
}

.card-title[b-lxtwxlv85u] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 4px;
}

.card-description[b-lxtwxlv85u] {
    display: block;
    font-size: 12px;
    color: var(--rz-text-secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-meta[b-lxtwxlv85u] {
    display: block;
    font-size: 12px;
    color: var(--rz-text-tertiary-color);
}

/* Folder path display in search results (Grid View) */
.card-folder-path[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--rz-primary);
    cursor: pointer;
    padding: 2px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: all 0.2s ease;
}

.card-folder-path:hover[b-lxtwxlv85u] {
    color: var(--rz-primary-dark);
    text-decoration: underline;
}

/* Matched tags in search results (Grid View) */
.card-matched-tags[b-lxtwxlv85u] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 4px 0;
}

.matched-tag-small[b-lxtwxlv85u] {
    padding: 1px 6px;
    background: #fef3c7;
    color: #92400e;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 500;
}

.more-tags-small[b-lxtwxlv85u] {
    padding: 1px 6px;
    background: #e5e7eb;
    color: #6b7280;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 500;
}

/* Card Actions */
.card-actions[b-lxtwxlv85u] {
    position: absolute;
    top: 8px;
    right: 8px;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.asset-card:hover .card-actions[b-lxtwxlv85u] {
    opacity: 1;
}

/* Empty State */
.empty-state[b-lxtwxlv85u] {
    grid-column: 1 / -1;
    text-align: center;
    padding: 60px 20px;
    color: var(--rz-text-secondary-color);
}

.empty-state[b-lxtwxlv85u]  .rz-icon {
    font-size: 64px;
    color: var(--rz-text-tertiary-color);
    margin-bottom: 16px;
}

.empty-state h3[b-lxtwxlv85u] {
    margin: 0 0 8px;
    color: var(--rz-text-color);
}

.empty-state p[b-lxtwxlv85u] {
    margin: 0 0 20px;
}

.empty-actions[b-lxtwxlv85u] {
    display: flex;
    gap: 12px;
    justify-content: center;
}

/* List View */
.assets-list-grid[b-lxtwxlv85u] {
    border-radius: 8px;
    overflow: hidden;
}

.list-thumbnail[b-lxtwxlv85u] {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    overflow: hidden;
    background: var(--rz-base-50);
    display: flex;
    align-items: center;
    justify-content: center;
}

.list-thumbnail img[b-lxtwxlv85u] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    padding: 4px;
    box-sizing: border-box;
}

.list-thumbnail[b-lxtwxlv85u]  .rz-icon {
    font-size: 20px;
    color: var(--rz-text-tertiary-color);
}

.list-actions[b-lxtwxlv85u] {
    display: flex;
    gap: 4px;
}

/* Override media-badge positioning for list view (inside table cells) */
.assets-list-grid .media-badge[b-lxtwxlv85u] {
    position: static;
    display: inline-block;
}

/* List View Name Cell with folder path */
.name-cell[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.item-name[b-lxtwxlv85u] {
    font-weight: 500;
}

.folder-path-link[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--rz-primary);
    cursor: pointer;
    transition: all 0.2s ease;
}

.folder-path-link:hover[b-lxtwxlv85u] {
    color: var(--rz-primary-dark);
    text-decoration: underline;
}

/* Matched tags in list view */
.matched-tags[b-lxtwxlv85u] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 2px;
}

.matched-tag[b-lxtwxlv85u] {
    padding: 1px 8px;
    background: #fef3c7;
    color: #92400e;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
}

.more-tags[b-lxtwxlv85u] {
    padding: 1px 8px;
    background: #e5e7eb;
    color: #6b7280;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
}

/* Pagination */
.pagination-container[b-lxtwxlv85u] {
    display: flex;
    justify-content: center;
    padding: 20px 0;
}

/* Detail Panel */
.detail-panel[b-lxtwxlv85u] {
    width: 400px;
    background: var(--rz-base-background-color);
    border: 2px solid #004F3C;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 280px);
    box-shadow: 0 8px 32px rgba(0, 79, 60, 0.15), 0 0 0 4px rgba(0, 79, 60, 0.08);
    position: sticky;
    top: 20px;
}

.panel-header[b-lxtwxlv85u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-grid-cell-border);
    flex-shrink: 0;
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%);
}

.panel-header h3[b-lxtwxlv85u] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: white;
}

.panel-header[b-lxtwxlv85u]  .rz-button {
    background: rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    border: none !important;
}

.panel-header[b-lxtwxlv85u]  .rz-button:hover {
    background: rgba(255, 255, 255, 0.3) !important;
}

.panel-preview[b-lxtwxlv85u] {
    padding: 12px;
    background: var(--rz-base-50);
    flex-shrink: 0;
    position: relative;
}

.preview-media-container[b-lxtwxlv85u] {
    position: relative;
    cursor: pointer;
    border-radius: 6px;
    overflow: hidden;
}

.preview-media-container:hover .preview-expand-btn[b-lxtwxlv85u] {
    opacity: 1;
}

.preview-media-container:hover[b-lxtwxlv85u]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.1);
    pointer-events: none;
}

.preview-expand-btn[b-lxtwxlv85u] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.2s ease;
    background: rgba(0, 0, 0, 0.6) !important;
    color: white !important;
    border: none !important;
    backdrop-filter: blur(4px);
}

.preview-expand-btn:hover[b-lxtwxlv85u] {
    background: rgba(0, 0, 0, 0.8) !important;
}

.preview-image[b-lxtwxlv85u] {
    width: 100%;
    max-height: 150px;
    object-fit: contain;
    border-radius: 6px;
    transition: transform 0.2s ease;
}

.preview-video[b-lxtwxlv85u] {
    width: 100%;
    max-height: 150px;
    border-radius: 6px;
}

/* Lightbox styles */
.lightbox-overlay[b-lxtwxlv85u] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.9);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn-b-lxtwxlv85u 0.2s ease;
    cursor: zoom-out;
}

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

.lightbox-content[b-lxtwxlv85u] {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lightbox-image[b-lxtwxlv85u] {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    cursor: default;
}

.lightbox-video[b-lxtwxlv85u] {
    max-width: 90vw;
    max-height: 90vh;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.lightbox-close[b-lxtwxlv85u] {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 10001;
    background: rgba(255, 255, 255, 0.1) !important;
    color: white !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    backdrop-filter: blur(4px);
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
}

.lightbox-close:hover[b-lxtwxlv85u] {
    background: rgba(255, 255, 255, 0.2) !important;
}

.lightbox-close[b-lxtwxlv85u]  .rz-icon {
    font-size: 24px !important;
}

.lightbox-info[b-lxtwxlv85u] {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.6);
    color: white;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 14px;
    backdrop-filter: blur(4px);
    text-align: center;
    max-width: 80vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.preview-placeholder[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    text-align: center;
    color: var(--rz-text-tertiary-color);
}

.preview-placeholder[b-lxtwxlv85u]  .rz-icon {
    font-size: 40px;
    margin-bottom: 8px;
}

.panel-info[b-lxtwxlv85u] {
    flex: 1;
    overflow-y: auto;
    padding: 12px 16px;
    min-height: 0;
}

.info-section[b-lxtwxlv85u] {
    margin-bottom: 12px;
}

.info-section:last-child[b-lxtwxlv85u] {
    margin-bottom: 0;
}

.info-section h4[b-lxtwxlv85u] {
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--rz-text-tertiary-color);
}

.info-row[b-lxtwxlv85u] {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    font-size: 12px;
}

.info-label[b-lxtwxlv85u] {
    color: var(--rz-text-secondary-color);
}

.info-value[b-lxtwxlv85u] {
    font-weight: 500;
    text-align: right;
    word-break: break-word;
}

.tags-container[b-lxtwxlv85u] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.tag-pill[b-lxtwxlv85u] {
    padding: 4px 10px;
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.panel-actions[b-lxtwxlv85u] {
    padding: 16px;
    padding-bottom: 20px;
    border-top: 1px solid var(--rz-grid-cell-border);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    flex-shrink: 0;
    background: var(--rz-base-background-color);
}

.panel-action-btn[b-lxtwxlv85u] {
    justify-content: center;
}

.show-on-mobile[b-lxtwxlv85u] {
    display: none;
}

/* Responsive Styles */
@media (max-width: 1200px) {
    .detail-panel[b-lxtwxlv85u] {
        position: fixed;
        top: 0;
        right: 0;
        height: 100vh;
        max-height: 100vh;
        z-index: 1000;
        box-shadow: -4px 0 20px rgba(0, 0, 0, 0.2);
        border-radius: 0;
    }
}

@media (max-width: 768px) {
    .asset-library-container[b-lxtwxlv85u] {
        padding: 0px;
    }

    .page-header[b-lxtwxlv85u] {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
    }

    .header-actions[b-lxtwxlv85u] {
        margin-left: auto;
    }

    /* Hide button text on mobile, show only icon */
    .action-btn-primary[b-lxtwxlv85u]  .rz-button-text {
        display: none;
    }

    .action-btn-primary[b-lxtwxlv85u]  .rz-button-icon-left {
        margin-right: 0;
    }

    .toolbar-section[b-lxtwxlv85u] {
        flex-direction: column;
        align-items: stretch;
    }

    .toolbar-left[b-lxtwxlv85u],
    .toolbar-right[b-lxtwxlv85u] {
        width: 100%;
        justify-content: space-between;
    }

    /* Breadcrumb mobile styles */
    .toolbar-section[b-lxtwxlv85u] {
        overflow: hidden;
    }

    .toolbar-left[b-lxtwxlv85u] {
        overflow: hidden;
        min-width: 0;
    }

    .breadcrumb-nav[b-lxtwxlv85u] {
        overflow: hidden;
        max-width: 100%;
    }

    .custom-breadcrumb[b-lxtwxlv85u] {
        font-size: 12px;
        gap: 4px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .custom-breadcrumb[b-lxtwxlv85u]::-webkit-scrollbar {
        display: none;
    }

    .breadcrumb-item[b-lxtwxlv85u] {
        padding: 2px 6px;
        flex-shrink: 0;
    }

    .breadcrumb-item span:not(.rzi)[b-lxtwxlv85u] {
        max-width: 80px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .breadcrumb-item[b-lxtwxlv85u]  .rz-icon {
        font-size: 14px;
    }

    .breadcrumb-separator[b-lxtwxlv85u] {
        flex-shrink: 0;
    }

    .folder-asset-count-badge[b-lxtwxlv85u] {
        padding: 2px 8px;
        font-size: 11px;
        margin-left: 8px;
    }

    .search-container[b-lxtwxlv85u]  .search-input {
        width: 100%;
    }

    .asset-grid[b-lxtwxlv85u] {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .detail-panel[b-lxtwxlv85u] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        max-height: 100%;
        border-radius: 0;
        border: none;
        box-shadow: none;
        z-index: 1001;
    }

    .detail-panel.mobile-panel[b-lxtwxlv85u] {
        animation: slideInFromRight-b-lxtwxlv85u 0.3s ease;
    }

    .panel-header[b-lxtwxlv85u] {
        padding: 16px;
        padding-top: max(16px, env(safe-area-inset-top));
    }

    .panel-header h3[b-lxtwxlv85u] {
        font-size: 16px;
        flex: 1;
        text-align: center;
        padding-right: 40px;
    }

    .panel-preview[b-lxtwxlv85u] {
        padding: 16px;
    }

    .preview-image[b-lxtwxlv85u],
    .preview-video[b-lxtwxlv85u] {
        max-height: 200px;
    }

    .panel-info[b-lxtwxlv85u] {
        padding: 16px;
    }

    .panel-actions[b-lxtwxlv85u] {
        padding: 16px;
        padding-bottom: max(20px, env(safe-area-inset-bottom));
    }

    .preview-expand-btn[b-lxtwxlv85u] {
        opacity: 1;
    }

    .hide-on-mobile[b-lxtwxlv85u] {
        display: none !important;
    }

    .show-on-mobile[b-lxtwxlv85u] {
        display: flex !important;
    }

    .card-actions[b-lxtwxlv85u] {
        opacity: 1;
    }
}

@media (max-width: 480px) {
    .asset-grid[b-lxtwxlv85u] {
        grid-template-columns: 1fr;
    }

    .card-thumbnail[b-lxtwxlv85u] {
        aspect-ratio: 16/9;
    }
}

@keyframes slideUp-b-lxtwxlv85u {
    from {
        transform: translateY(100%);
    }
    to {
        transform: translateY(0);
    }
}

@keyframes slideInFromRight-b-lxtwxlv85u {
    from {
        transform: translateX(100%);
    }
    to {
        transform: translateX(0);
    }
}

/* Mobile back button */
.panel-back-btn[b-lxtwxlv85u] {
    display: none;
}

.panel-close-btn[b-lxtwxlv85u] {
    /* Default: visible on desktop */
}

@media (max-width: 768px) {
    .panel-back-btn[b-lxtwxlv85u] {
        display: flex !important;
        position: absolute;
        left: 16px;
        background: rgba(255, 255, 255, 0.2) !important;
        color: white !important;
        border: none !important;
    }

    .panel-back-btn:hover[b-lxtwxlv85u] {
        background: rgba(255, 255, 255, 0.3) !important;
    }

    .panel-header[b-lxtwxlv85u] {
        position: relative;
        justify-content: center;
    }

    .panel-header .panel-close-btn[b-lxtwxlv85u] {
        display: none !important;
    }

    .panel-header h3[b-lxtwxlv85u] {
        padding-left: 40px;
        padding-right: 0;
    }
}

/* Loading Overlay */
.spinner-overlay[b-lxtwxlv85u] {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    background: #201f1e;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    /* Escape parent transform/filter containing blocks */
    transform: translateZ(0);
}

.custom-loading[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.loading-gif[b-lxtwxlv85u] {
    width: 120px;
    height: 120px;
    object-fit: contain;
}

.loading-text[b-lxtwxlv85u] {
    color: white;
    font-size: 18px;
    font-weight: 500;
    margin: 0;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    font-family: 'ABCWhyte', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Recent View Styles */
.view-more-container[b-lxtwxlv85u] {
    display: flex;
    justify-content: center;
    padding: 24px 0;
    margin-top: 16px;
}

.view-more-btn[b-lxtwxlv85u] {
    border-radius: 10px !important;
    font-weight: 500 !important;
    padding: 12px 32px !important;
    border: 2px solid var(--rz-grid-cell-border) !important;
}

.view-more-btn:hover:not(:disabled)[b-lxtwxlv85u] {
    background: var(--rz-primary-lighter) !important;
    color: var(--rz-primary) !important;
    border-color: var(--rz-primary) !important;
}

.recent-loading[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 40px;
    color: var(--rz-text-secondary-color);
}

.recent-grid[b-lxtwxlv85u] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

.recent-card[b-lxtwxlv85u] {
    position: relative;
    background: var(--rz-base-background-color);
    border: 1px solid var(--rz-grid-cell-border);
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s ease;
}

.recent-card:hover[b-lxtwxlv85u] {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    transform: translateY(-4px);
}

.recent-card.selected[b-lxtwxlv85u] {
    border-color: var(--rz-primary);
    box-shadow: 0 0 0 3px var(--rz-primary-lighter);
}

.recent-thumbnail[b-lxtwxlv85u] {
    position: relative;
    aspect-ratio: 16 / 10;
    background: linear-gradient(135deg, var(--rz-base-50) 0%, var(--rz-base-100) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.recent-thumbnail img[b-lxtwxlv85u] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    padding: 8px;
    box-sizing: border-box;
    transition: transform 0.3s ease;
}

.recent-card:hover .recent-thumbnail img[b-lxtwxlv85u] {
    transform: scale(1.05);
}

.recent-thumbnail .thumbnail-placeholder[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: var(--rz-text-tertiary-color);
}

.recent-thumbnail .thumbnail-placeholder[b-lxtwxlv85u]  .rz-icon {
    font-size: 56px;
}


.recent-info[b-lxtwxlv85u] {
    padding: 16px;
}

.recent-title[b-lxtwxlv85u] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.4;
    margin-bottom: 6px;
    color: var(--rz-text-color);
}

.recent-meta[b-lxtwxlv85u] {
    display: block;
    font-size: 13px;
    color: var(--rz-text-tertiary-color);
}

.recent-actions[b-lxtwxlv85u] {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.recent-card:hover .recent-actions[b-lxtwxlv85u] {
    opacity: 1;
}

.recent-actions[b-lxtwxlv85u]  .rz-button {
    background: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(4px);
}

.recent-actions[b-lxtwxlv85u]  .rz-button:hover {
    background: white !important;
}

/* Recent view responsive styles */
@media (max-width: 768px) {
    .recent-grid[b-lxtwxlv85u] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .recent-card[b-lxtwxlv85u] {
        border-radius: 10px;
    }

    .recent-thumbnail[b-lxtwxlv85u] {
        aspect-ratio: 16 / 9;
    }

    .recent-actions[b-lxtwxlv85u] {
        opacity: 1;
    }

    .recent-info[b-lxtwxlv85u] {
        padding: 12px;
    }
}

@media (max-width: 480px) {
    .recent-grid[b-lxtwxlv85u] {
        gap: 10px;
    }

    .recent-thumbnail[b-lxtwxlv85u] {
        aspect-ratio: 4 / 3;
    }
}

/* Activity Feed Sidebar */
.activity-feed-sidebar[b-lxtwxlv85u] {
    width: 380px;
    background: var(--rz-base-background-color);
    border: 1px solid var(--rz-grid-cell-border);
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 200px);
    flex-shrink: 0;
    animation: slideInRight-b-lxtwxlv85u 0.3s ease;
}

@keyframes slideInRight-b-lxtwxlv85u {
    from {
        transform: translateX(20px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.content-area.with-activity-feed .assets-container[b-lxtwxlv85u] {
    flex: 1;
    min-width: 0;
}

.activity-feed-header[b-lxtwxlv85u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--rz-grid-cell-border);
    background: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%);
}

.activity-feed-header h3[b-lxtwxlv85u] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: white;
}

.activity-feed-header[b-lxtwxlv85u]  .rz-button {
    background: rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    border: none !important;
}

.activity-feed-header[b-lxtwxlv85u]  .rz-button:hover {
    background: rgba(255, 255, 255, 0.3) !important;
}

.activity-feed-content[b-lxtwxlv85u] {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
}

.activity-loading[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #6b7280;
}

.activity-loading span[b-lxtwxlv85u] {
    margin-top: 12px;
    font-size: 14px;
}

.activity-list[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.activity-item[b-lxtwxlv85u] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    background: #f9fafb;
    border-radius: 10px;
    transition: all 0.15s ease;
}

.activity-item.clickable[b-lxtwxlv85u] {
    cursor: pointer;
}

.activity-item.clickable:hover[b-lxtwxlv85u] {
    background: #f3f4f6;
    transform: translateX(2px);
}

.activity-item.deleted[b-lxtwxlv85u] {
    opacity: 0.6;
}

.activity-item.deleted .activity-target[b-lxtwxlv85u] {
    text-decoration: line-through;
}

.activity-icon[b-lxtwxlv85u] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.activity-icon[b-lxtwxlv85u]  .rz-icon {
    font-size: 18px;
    color: white;
}

.activity-icon.upload[b-lxtwxlv85u] { background: #10b981; }
.activity-icon.download[b-lxtwxlv85u] { background: #3b82f6; }
.activity-icon.share[b-lxtwxlv85u] { background: #8b5cf6; }
.activity-icon.view[b-lxtwxlv85u] { background: #6b7280; }
.activity-icon.edit[b-lxtwxlv85u] { background: #f59e0b; }
.activity-icon.delete[b-lxtwxlv85u] { background: #ef4444; }
.activity-icon.move[b-lxtwxlv85u] { background: #6366f1; }
.activity-icon.folder[b-lxtwxlv85u] { background: #f9a825; }

.activity-content[b-lxtwxlv85u] {
    flex: 1;
    min-width: 0;
}

.activity-header[b-lxtwxlv85u] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: baseline;
    font-size: 13px;
    line-height: 1.4;
}

.activity-user[b-lxtwxlv85u] {
    font-weight: 600;
    color: #111827;
}

.activity-action[b-lxtwxlv85u] {
    color: #6b7280;
}

.activity-target[b-lxtwxlv85u] {
    color: #111827;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 150px;
}

.activity-meta[b-lxtwxlv85u] {
    display: flex;
    gap: 8px;
    margin-top: 4px;
    font-size: 12px;
    color: #9ca3af;
}

.activity-details[b-lxtwxlv85u] {
    color: #6b7280;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 120px;
}

.activity-thumbnail[b-lxtwxlv85u] {
    width: 44px;
    height: 44px;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
}

.activity-thumbnail img[b-lxtwxlv85u] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 2px;
    box-sizing: border-box;
}

.activity-arrow[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
    flex-shrink: 0;
}

.activity-arrow[b-lxtwxlv85u]  .rz-icon {
    font-size: 20px;
}

.activity-empty[b-lxtwxlv85u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    color: #6b7280;
}

.activity-empty[b-lxtwxlv85u]  .rz-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.4;
}

.activity-empty h3[b-lxtwxlv85u] {
    margin: 0 0 8px 0;
    color: #374151;
    font-size: 18px;
}

.activity-empty p[b-lxtwxlv85u] {
    margin: 0;
    font-size: 14px;
}

/* Activity button active state */
.activity-btn.active[b-lxtwxlv85u] {
    background: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%) !important;
    color: white !important;
    border-color: #8b5cf6 !important;
}

/* Responsive styles for Activity Feed */
@media (max-width: 1200px) {
    .activity-feed-sidebar[b-lxtwxlv85u] {
        position: fixed;
        top: 0;
        right: 0;
        height: 100vh;
        max-height: 100vh;
        z-index: 1000;
        box-shadow: -4px 0 20px rgba(0, 0, 0, 0.2);
        border-radius: 0;
        width: 380px;
    }
}

@media (max-width: 768px) {
    .activity-feed-sidebar[b-lxtwxlv85u] {
        width: 100%;
        border-radius: 20px 20px 0 0;
        bottom: 0;
        top: auto;
        height: auto;
        max-height: 80vh;
        animation: slideUp-b-lxtwxlv85u 0.3s ease;
    }

    .activity-feed-sidebar.mobile-sidebar[b-lxtwxlv85u] {
        animation: slideUp-b-lxtwxlv85u 0.3s ease;
    }

    .activity-feed-header[b-lxtwxlv85u] {
        padding: 20px;
        border-radius: 20px 20px 0 0;
    }

    .activity-feed-header h3[b-lxtwxlv85u] {
        font-size: 18px;
    }

    .activity-feed-content[b-lxtwxlv85u] {
        padding: 16px;
        padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    }

    .activity-item[b-lxtwxlv85u] {
        padding: 14px;
    }

    .activity-target[b-lxtwxlv85u] {
        max-width: 180px;
    }

    /* PWA safe area handling */
    @supports (padding-bottom: env(safe-area-inset-bottom)) {
        .activity-feed-content[b-lxtwxlv85u] {
            padding-bottom: calc(16px + env(safe-area-inset-bottom));
        }
    }
}

@media (max-width: 480px) {
    .activity-feed-sidebar[b-lxtwxlv85u] {
        max-height: 85vh;
    }

    .activity-thumbnail[b-lxtwxlv85u] {
        width: 40px;
        height: 40px;
    }

    .activity-target[b-lxtwxlv85u] {
        max-width: 140px;
    }
}

/* ============================================
   Multi-Select Styles
   ============================================ */

/* Multi-selected card state */
.asset-card.multi-selected[b-lxtwxlv85u],
.recent-card.multi-selected[b-lxtwxlv85u] {
    border-color: #004F3C;
    box-shadow: 0 0 0 3px rgba(0, 79, 60, 0.2);
    background: rgba(0, 79, 60, 0.03);
}

.asset-card.multi-selected:hover[b-lxtwxlv85u],
.recent-card.multi-selected:hover[b-lxtwxlv85u] {
    box-shadow: 0 0 0 3px rgba(0, 79, 60, 0.3), 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Recent card thumbnail needs position relative for checkmark */
.recent-thumbnail[b-lxtwxlv85u] {
    position: relative;
}

/* Checkmark overlay on multi-selected cards */
.multi-select-check[b-lxtwxlv85u] {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 10;
    width: 28px;
    height: 28px;
    background: #004F3C;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 79, 60, 0.4);
    animation: scaleIn-b-lxtwxlv85u 0.2s ease;
}

.multi-select-check[b-lxtwxlv85u]  .rz-icon {
    font-size: 18px;
    color: white;
}

@keyframes scaleIn-b-lxtwxlv85u {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Floating multi-select action bar */
.multi-select-bar[b-lxtwxlv85u] {
    position: sticky;
    bottom: 24px;
    left: 80%;
    z-index: 1000;
    animation: slideUpBar-b-lxtwxlv85u 0.3s ease;
}

@keyframes slideUpBar-b-lxtwxlv85u {
    from {
        opacity: 0;
        translate: 0 100px;
    }
    to {
        opacity: 1;
        translate: 0 0;
    }
}

.multi-select-bar-content[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 20px;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 12px 20px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15), 0 2px 8px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(8px);
}

.multi-select-info[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.multi-select-count[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    font-size: 15px;
    color: #004F3C;
}

.multi-select-count[b-lxtwxlv85u]  .rz-icon {
    font-size: 20px;
    color: #004F3C;
}

.multi-select-size[b-lxtwxlv85u] {
    font-size: 13px;
    color: #6b7280;
    padding-left: 12px;
    border-left: 1px solid #e5e7eb;
}

.multi-select-actions[b-lxtwxlv85u] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 12px;
    border-left: 1px solid #e5e7eb;
}

.multi-select-action-btn[b-lxtwxlv85u] {
    border-radius: 10px !important;
    font-weight: 500 !important;
}

.multi-select-download-btn[b-lxtwxlv85u] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 8px rgba(0, 79, 60, 0.25) !important;
    transition: all 0.2s ease !important;
}

.multi-select-download-btn:hover:not(:disabled)[b-lxtwxlv85u] {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 79, 60, 0.35) !important;
}

.multi-select-download-btn:disabled[b-lxtwxlv85u] {
    opacity: 0.7 !important;
    cursor: wait !important;
}

.multi-select-close-btn[b-lxtwxlv85u] {
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    min-width: 32px !important;
}

.multi-select-close-btn:hover[b-lxtwxlv85u] {
    background: #fee2e2 !important;
    color: #dc2626 !important;
}

/* Responsive styles for multi-select bar */
@media (max-width: 768px) {
    .multi-select-bar[b-lxtwxlv85u] {
        bottom: 16px;
        left: 16px;
        right: 16px;
    }

    .multi-select-bar-content[b-lxtwxlv85u] {
        flex-direction: column;
        gap: 12px;
        padding: 16px;
        width: 100%;
        box-sizing: border-box;
    }

    .multi-select-info[b-lxtwxlv85u] {
        width: 100%;
        justify-content: space-between;
    }

    .multi-select-size[b-lxtwxlv85u] {
        border-left: none;
        padding-left: 0;
    }

    .multi-select-actions[b-lxtwxlv85u] {
        width: 100%;
        border-left: none;
        padding-left: 0;
        justify-content: space-between;
    }

    .multi-select-action-btn[b-lxtwxlv85u]  .rz-button-text {
        display: none;
    }

    .multi-select-download-btn[b-lxtwxlv85u] {
        flex: 1;
    }

    .multi-select-download-btn[b-lxtwxlv85u]  .rz-button-text {
        display: inline !important;
    }
}

@media (max-width: 480px) {
    .multi-select-bar[b-lxtwxlv85u] {
        bottom: 12px;
        left: 12px;
        right: 12px;
    }

    .multi-select-bar-content[b-lxtwxlv85u] {
        padding: 12px 16px;
        border-radius: 14px;
    }

    .multi-select-count[b-lxtwxlv85u] {
        font-size: 14px;
    }

    .multi-select-count[b-lxtwxlv85u]  .rz-icon {
        font-size: 18px;
    }
}

/* Hint text for multi-select (shown on hover) */
.multi-select-hint[b-lxtwxlv85u] {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    white-space: nowrap;
    margin-bottom: 8px;
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}

.asset-card:hover .multi-select-hint[b-lxtwxlv85u] {
    opacity: 1;
}

/* /Components/Pages/DistributorMasters.razor.rz.scp.css */
/* Base styles */
img[b-wqu3s2iqua] {
    object-fit: contain;
}

.rz-column-title-content[b-wqu3s2iqua] {
    white-space: normal !important;
    word-break: normal !important;
}

.loading[b-wqu3s2iqua] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Mobile-responsive grid button styles */
@media (max-width: 768px) {
    /* Make button columns narrower on mobile */
    [b-wqu3s2iqua] .rz-data-grid .rz-data-row td:first-child,
    [b-wqu3s2iqua] .rz-data-grid .rz-data-row td:last-child {
        min-width: 44px !important;
        width: auto !important;
        padding: 4px !important;
    }

    /* Compact buttons on mobile */
    [b-wqu3s2iqua] .rz-data-grid .rz-button {
        min-width: 36px !important;
        width: 36px !important;
        height: 36px !important;
        padding: 0 !important;
        margin: 2px !important;
    }

    /* Hide button text on mobile, show only icon */
    [b-wqu3s2iqua] .rz-data-grid .rz-button .rz-button-text {
        display: none !important;
    }

    /* Ensure icon is centered */
    [b-wqu3s2iqua] .rz-data-grid .rz-button .rz-button-icon {
        margin: 0 !important;
    }

    /* Adjust column headers for mobile */
    [b-wqu3s2iqua] .rz-data-grid th {
        padding: 6px 4px !important;
        font-size: 11px !important;
    }

    /* Make grid cells more compact */
    [b-wqu3s2iqua] .rz-data-grid td {
        padding: 4px !important;
        font-size: 12px !important;
    }
}

/* Extra small screens (phones) */
@media (max-width: 480px) {
    [b-wqu3s2iqua] .rz-data-grid .rz-button {
        min-width: 32px !important;
        width: 32px !important;
        height: 32px !important;
    }

    [b-wqu3s2iqua] .rz-data-grid td,
    [b-wqu3s2iqua] .rz-data-grid th {
        padding: 3px !important;
    }
}
/* /Components/Pages/EditProduct.razor.rz.scp.css */
/* ============================================
   EDIT PRODUCT PAGE - Modern Layout
   ============================================ */

.edit-product-page[b-rm2a5j2m28] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 16px;
}

/* ============================================
   HEADER
   ============================================ */
.product-header[b-rm2a5j2m28] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    background: white;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    margin-bottom: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.header-left[b-rm2a5j2m28] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-left[b-rm2a5j2m28]  .rz-breadcrumb {
    margin: 0;
    font-size: 13px;
}

.header-left h1[b-rm2a5j2m28] {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    color: #111827;
}

.header-right[b-rm2a5j2m28] {
    display: flex;
    gap: 12px;
}

.btn-cancel[b-rm2a5j2m28] {
    background: white !important;
    color: #6b7280 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 10px 20px !important;
    font-weight: 500 !important;
    transition: all 0.15s ease !important;
}

.btn-cancel:hover[b-rm2a5j2m28] {
    background: #f9fafb !important;
    border-color: #d1d5db !important;
}

.btn-save[b-rm2a5j2m28] {
    background: #004F3C !important;
    color: white !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    font-weight: 500 !important;
    box-shadow: 0 1px 2px rgba(0, 79, 60, 0.2) !important;
    transition: all 0.15s ease !important;
}

.btn-save:hover:not(:disabled)[b-rm2a5j2m28] {
    background: #003d2e !important;
    box-shadow: 0 4px 12px rgba(0, 79, 60, 0.25) !important;
}

.btn-save:disabled[b-rm2a5j2m28] {
    opacity: 0.6 !important;
}

/* ============================================
   ALERTS
   ============================================ */
.page-alert[b-rm2a5j2m28] {
    margin-bottom: 16px;
    border-radius: 10px;
}

.alert-content[b-rm2a5j2m28] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

/* ============================================
   MAIN LAYOUT - Two Column
   ============================================ */
.product-layout[b-rm2a5j2m28] {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 12px;
    align-items: start;
}

/* ============================================
   SIDEBAR (Left Column)
   ============================================ */
.product-sidebar[b-rm2a5j2m28] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: sticky;
    top: 20px;
}

.sidebar-card[b-rm2a5j2m28] {
    background: white;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    padding: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

/* Product Image */
.product-image-wrapper[b-rm2a5j2m28] {
    width: 100%;
    aspect-ratio: 1;
    background: linear-gradient(135deg, #f8f9fa 0%, #f1f3f4 100%);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: 12px;
}

.product-image-wrapper[b-rm2a5j2m28]  .product-image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.image-placeholder[b-rm2a5j2m28] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: #9ca3af;
}

.image-placeholder[b-rm2a5j2m28]  .rz-icon {
    font-size: 48px;
    opacity: 0.5;
}

.image-placeholder span[b-rm2a5j2m28] {
    font-size: 13px;
}

.image-url-input[b-rm2a5j2m28] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Can Image - smaller preview */
.can-image-wrapper[b-rm2a5j2m28] {
    aspect-ratio: auto;
    height: 120px;
}

.can-image-wrapper[b-rm2a5j2m28]  .can-image {
    max-height: 100px;
}

/* Override global .form-input styles for sidebar */
.sidebar-card[b-rm2a5j2m28]  .form-input,
.sidebar-card[b-rm2a5j2m28]  .rz-textbox {
    padding: 6px 10px !important;
    min-height: 32px !important;
    font-size: 13px !important;
    border-radius: 6px !important;
    border: 1px solid #e2e8f0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

.sidebar-card[b-rm2a5j2m28]  .rz-px-4,
.sidebar-card[b-rm2a5j2m28]  .rz-pl-4,
.sidebar-card[b-rm2a5j2m28]  .rz-pr-4 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.sidebar-card[b-rm2a5j2m28]  .rz-textbox input {
    font-size: 13px !important;
    font-weight: 400;
    padding: 6px 10px !important;
}

/* Card Title */
.card-title[b-rm2a5j2m28] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin: 0 0 12px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #f3f4f6;
}

.card-title[b-rm2a5j2m28]  .rz-icon {
    font-size: 18px;
    color: #004F3C;
}

/* Barcodes */
.barcode-group[b-rm2a5j2m28] {
    margin-bottom: 14px;
}

.barcode-group:last-child[b-rm2a5j2m28] {
    margin-bottom: 0;
}

.barcode-label[b-rm2a5j2m28] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #6b7280;
    margin-bottom: 8px;
}

.barcode-preview[b-rm2a5j2m28] {
    height: 70px;
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0e8 100%);
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.barcode-preview img[b-rm2a5j2m28] {
    max-height: 55px;
    max-width: 90%;
    object-fit: contain;
}

.barcode-empty[b-rm2a5j2m28] {
    color: #d1d5db;
}

.barcode-empty[b-rm2a5j2m28]  .rz-icon {
    font-size: 28px;
}

.barcode-input[b-rm2a5j2m28]  input {
    font-family: 'SF Mono', 'Monaco', 'Consolas', monospace !important;
    font-size: 12px !important;
    letter-spacing: 0.5px;
}

/* ============================================
   MAIN CONTENT (Right Column)
   ============================================ */
.product-main[b-rm2a5j2m28] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Form Sections */
.form-section[b-rm2a5j2m28] {
    background: white;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.section-title[b-rm2a5j2m28] {
    font-size: 14px;
    font-weight: 600;
    color: #111827;
    margin: 0 0 14px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #f3f4f6;
}

/* Form Fields */
.form-field[b-rm2a5j2m28] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-field[b-rm2a5j2m28]  .rz-label {
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

.form-field[b-rm2a5j2m28]  .rz-textbox,
.form-field[b-rm2a5j2m28]  .rz-textarea,
.form-field[b-rm2a5j2m28]  .rz-numeric,
.form-field[b-rm2a5j2m28]  .rz-dropdown,
.form-field[b-rm2a5j2m28]  .rz-dropdown-datagrid {
    width: 100%;
    border-radius: 6px;
}

/* Override global .form-input styles */
.form-field[b-rm2a5j2m28]  .form-input,
.form-field[b-rm2a5j2m28]  .rz-textbox,
.form-field[b-rm2a5j2m28]  .rz-textarea,
.form-field[b-rm2a5j2m28]  .rz-numeric {
    padding: 6px 10px !important;
    min-height: 32px !important;
    font-size: 13px !important;
    border-radius: 6px !important;
    border: 1px solid #e2e8f0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

/* Remove Radzen padding utilities */
.form-field[b-rm2a5j2m28]  .rz-px-4,
.form-field[b-rm2a5j2m28]  .rz-pl-4,
.form-field[b-rm2a5j2m28]  .rz-pr-4 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.form-field[b-rm2a5j2m28]  .rz-textbox input,
.form-field[b-rm2a5j2m28]  .rz-textarea textarea,
.form-field[b-rm2a5j2m28]  .rz-numeric input {
    font-size: 13px !important;
    font-weight: 400;
    padding: 6px 10px !important;
}

.form-field[b-rm2a5j2m28]  .rz-validator {
    font-size: 11px;
    margin-top: 4px;
}

.form-field[b-rm2a5j2m28]  .rz-selectbar {
    border-radius: 8px;
}

/* Form Row - Horizontal layout */
.form-row[b-rm2a5j2m28] {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
}

.form-row:last-child[b-rm2a5j2m28] {
    margin-bottom: 0;
}

.form-row .form-field[b-rm2a5j2m28] {
    flex: 1;
    min-width: 0;
}

.form-row .form-field.flex-grow[b-rm2a5j2m28] {
    flex: 2;
}

/* Form Grid - 2x3 or 3x2 layouts */
.form-grid[b-rm2a5j2m28] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

/* Stacked rows for larger content */
.form-row-stacked[b-rm2a5j2m28] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

/* ============================================
   LOADING STATE
   ============================================ */
.loading-state[b-rm2a5j2m28] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    background: white;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
}

.loading-state img[b-rm2a5j2m28] {
    width: 80px;
    height: 80px;
}

.loading-state p[b-rm2a5j2m28] {
    color: #6b7280;
    margin: 16px 0 0 0;
    font-size: 14px;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

/* Tablet - Stack sidebar on top */
@media (max-width: 1024px) {
    .product-layout[b-rm2a5j2m28] {
        grid-template-columns: 1fr;
    }

    .product-sidebar[b-rm2a5j2m28] {
        display: grid;
        grid-template-columns: 260px 1fr;
        gap: 12px;
        position: static;
    }

    .product-image-wrapper[b-rm2a5j2m28] {
        aspect-ratio: 1;
        max-height: 260px;
    }

    .form-grid[b-rm2a5j2m28] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile */
@media (max-width: 768px) {
    .edit-product-page[b-rm2a5j2m28] {
        padding: 0 12px;
    }

    .product-header[b-rm2a5j2m28] {
        flex-direction: column;
        gap: 16px;
        padding: 16px;
        align-items: stretch;
    }

    .header-left[b-rm2a5j2m28] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .header-right[b-rm2a5j2m28] {
        justify-content: flex-end;
    }

    .product-sidebar[b-rm2a5j2m28] {
        grid-template-columns: 1fr;
    }

    .product-image-wrapper[b-rm2a5j2m28] {
        max-height: 200px;
    }

    .form-section[b-rm2a5j2m28] {
        padding: 16px;
    }

    .form-row[b-rm2a5j2m28] {
        flex-direction: column;
    }

    .form-grid[b-rm2a5j2m28] {
        grid-template-columns: 1fr;
    }

    .form-row-stacked[b-rm2a5j2m28] {
        grid-template-columns: 1fr;
    }
}

/* Small Mobile */
@media (max-width: 480px) {
    .product-header[b-rm2a5j2m28] {
        padding: 12px;
        border-radius: 10px;
    }

    .header-left h1[b-rm2a5j2m28] {
        font-size: 18px;
    }

    .btn-cancel[b-rm2a5j2m28],
    .btn-save[b-rm2a5j2m28] {
        padding: 8px 16px !important;
        font-size: 13px !important;
    }

    .sidebar-card[b-rm2a5j2m28],
    .form-section[b-rm2a5j2m28] {
        padding: 14px;
        border-radius: 10px;
    }

    .section-title[b-rm2a5j2m28] {
        font-size: 14px;
    }
}

/* ============================================
   ANIMATIONS
   ============================================ */
@keyframes fadeIn-b-rm2a5j2m28 {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.product-header[b-rm2a5j2m28],
.sidebar-card[b-rm2a5j2m28],
.form-section[b-rm2a5j2m28] {
    animation: fadeIn-b-rm2a5j2m28 0.3s ease forwards;
}

.sidebar-card:nth-child(2)[b-rm2a5j2m28] {
    animation-delay: 0.05s;
}

.form-section:nth-child(1)[b-rm2a5j2m28] { animation-delay: 0.1s; }
.form-section:nth-child(2)[b-rm2a5j2m28] { animation-delay: 0.15s; }
.form-section:nth-child(3)[b-rm2a5j2m28] { animation-delay: 0.2s; }
.form-section:nth-child(4)[b-rm2a5j2m28] { animation-delay: 0.25s; }
/* /Components/Pages/Incentives/IncentiveDashboard.razor.rz.scp.css */
/* Incentive Dashboard Styles */

/* Loading Overlay */
.spinner-overlay[b-e00a7vs5dr] {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    background: #201f1e;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transform: translateZ(0);
}

.custom-loading[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.loading-gif[b-e00a7vs5dr] {
    width: 120px;
    height: 120px;
    object-fit: contain;
}

.loading-text[b-e00a7vs5dr] {
    color: white;
    font-size: 18px;
    font-weight: 500;
    margin: 0;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    font-family: 'ABCWhyte', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.incentive-dashboard-container[b-e00a7vs5dr] {
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    min-height: 100vh;
}

/* Page Header */
.page-header[b-e00a7vs5dr] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.header-content h1[b-e00a7vs5dr] {
    margin: 0 0 0.25rem 0;
    color: var(--rz-primary);
    font-size: 1.75rem;
}

.header-content p[b-e00a7vs5dr] {
    margin: 0;
    color: #6b7280;
    font-size: 0.95rem;
}

.header-actions[b-e00a7vs5dr] {
    display: flex;
    gap: 0.75rem;
}

.action-btn-primary[b-e00a7vs5dr] {
    background: var(--rz-primary) !important;
}

.action-btn-secondary[b-e00a7vs5dr] {
    border-color: var(--rz-primary) !important;
    color: var(--rz-primary) !important;
}

/* Filters Section */
.filters-section[b-e00a7vs5dr] {
    background: white;
    border-radius: 12px;
    padding: 0;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.filters-header[b-e00a7vs5dr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s;
}

.filters-header:hover[b-e00a7vs5dr] {
    background: #f9fafb;
}

.filters-title[b-e00a7vs5dr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    color: #374151;
}

.filters-title[b-e00a7vs5dr]  .rzi {
    font-size: 1.1rem;
    color: #6b7280;
}

.active-filter-badge[b-e00a7vs5dr] {
    background: var(--rz-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
}

.expand-icon[b-e00a7vs5dr] {
    color: #9ca3af;
    transition: transform 0.2s;
}

.filters-row[b-e00a7vs5dr] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    padding: 0 1.25rem 1rem 1.25rem;
    border-top: 1px solid #f3f4f6;
    padding-top: 1rem;
}

.filter-group[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.filter-group label[b-e00a7vs5dr] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.date-range-picker[b-e00a7vs5dr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.date-picker[b-e00a7vs5dr] {
    width: 130px;
}

.date-separator[b-e00a7vs5dr] {
    color: #9ca3af;
    font-size: 0.85rem;
}

.filter-actions[b-e00a7vs5dr] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

/* KPI Cards */
.kpi-cards-section[b-e00a7vs5dr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.kpi-card[b-e00a7vs5dr] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s, box-shadow 0.2s;
}

.kpi-card:hover[b-e00a7vs5dr] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.kpi-icon[b-e00a7vs5dr] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.kpi-icon[b-e00a7vs5dr]  .rzi {
    font-size: 1.5rem;
}

.programs-card .kpi-icon[b-e00a7vs5dr] { color: #004F3C; }
.payout-card .kpi-icon[b-e00a7vs5dr] { color: #10b981; }
.accounts-card .kpi-icon[b-e00a7vs5dr] { color: #3b82f6; }
.cases-card .kpi-icon[b-e00a7vs5dr] { color: #8b5cf6; }
.pod-card .kpi-icon[b-e00a7vs5dr] { color: #004F3C; }
.distributors-card .kpi-icon[b-e00a7vs5dr] { color: #6366f1; }

/* Highlight card for primary KPI (POD) */
.highlight-card[b-e00a7vs5dr] {
    background: linear-gradient(135deg, #004F3C 0%, #006B52 100%);
    border: 2px solid #004F3C;
}

.highlight-card .kpi-icon[b-e00a7vs5dr],
.highlight-card .kpi-value[b-e00a7vs5dr],
.highlight-card .kpi-label[b-e00a7vs5dr] {
    color: white !important;
}

.highlight-card .kpi-breakdown[b-e00a7vs5dr] {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.highlight-card .breakdown-item[b-e00a7vs5dr] {
    color: rgba(255, 255, 255, 0.9);
}

.kpi-content[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
}

.kpi-value[b-e00a7vs5dr] {
    font-size: 1.75rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.2;
}

.kpi-label[b-e00a7vs5dr] {
    font-size: 0.8rem;
    color: #6b7280;
    margin-top: 0.25rem;
}

.kpi-breakdown[b-e00a7vs5dr] {
    display: flex;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f3f4f6;
}

.breakdown-item[b-e00a7vs5dr] {
    font-size: 0.75rem;
    color: #6b7280;
}

.breakdown-item.active[b-e00a7vs5dr] { color: #10b981; }
.breakdown-item.upcoming[b-e00a7vs5dr] { color: #f59e0b; }
.breakdown-item.bero[b-e00a7vs5dr] { color: var(--rz-primary); }
.breakdown-item.dist[b-e00a7vs5dr] { color: #3b82f6; }
.breakdown-item.cost[b-e00a7vs5dr] { color: #8b5cf6; font-weight: 500; }
.breakdown-item.rebuy[b-e00a7vs5dr] { color: #f97316; font-weight: 500; }

/* Alert Cards */
.alert-cards-section[b-e00a7vs5dr] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.alert-card[b-e00a7vs5dr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
    border-radius: 8px;
    font-size: 0.9rem;
}

.alert-card.ending-soon[b-e00a7vs5dr] {
    background: #fef3c7;
    border: 1px solid #f59e0b;
    color: #92400e;
}

.alert-card.starting-soon[b-e00a7vs5dr] {
    background: #d1fae5;
    border: 1px solid #10b981;
    color: #065f46;
}

.alert-card[b-e00a7vs5dr]  .rzi {
    font-size: 1.25rem;
}

/* Charts Section */
.charts-row[b-e00a7vs5dr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.chart-card[b-e00a7vs5dr] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.chart-card h3[b-e00a7vs5dr] {
    margin: 0 0 1rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.chart-header-with-filter[b-e00a7vs5dr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.chart-header-with-filter h3[b-e00a7vs5dr] {
    margin: 0;
}

.chart-filter-badge[b-e00a7vs5dr] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: var(--rz-primary);
    color: white;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.3rem 0.6rem;
    border-radius: 9999px;
    animation: fadeIn-b-e00a7vs5dr 0.2s ease-in-out;
}

.chart-filter-badge[b-e00a7vs5dr]  .rzi {
    font-size: 0.85rem;
}

.region-badge-filter[b-e00a7vs5dr] {
    background: #6366f1;
}

.clear-filter-x[b-e00a7vs5dr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.25rem;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.clear-filter-x:hover[b-e00a7vs5dr] {
    opacity: 1;
}

.clear-filter-x[b-e00a7vs5dr]  .rzi {
    font-size: 0.75rem;
}

@keyframes fadeIn-b-e00a7vs5dr {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}

.chart-filtered[b-e00a7vs5dr] {
    border: 2px solid var(--rz-primary);
    box-shadow: 0 0 0 3px rgba(0, 79, 60, 0.1);
}

.trend-controls[b-e00a7vs5dr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.no-data[b-e00a7vs5dr] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: #9ca3af;
    font-size: 0.9rem;
}

.chart-loading[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 250px;
    gap: 1rem;
    color: #6b7280;
    font-size: 0.9rem;
}

/* Performers Section */
.performers-section[b-e00a7vs5dr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.performers-card[b-e00a7vs5dr] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.performers-header[b-e00a7vs5dr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f3f4f6;
}

.performers-header h3[b-e00a7vs5dr] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.top-performers .performers-header h3[b-e00a7vs5dr] { color: #10b981; }
.bottom-performers .performers-header h3[b-e00a7vs5dr] { color: #f59e0b; }

.performers-subtitle[b-e00a7vs5dr] {
    font-size: 0.75rem;
    color: #9ca3af;
    margin-left: auto;
}

.performers-list[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.performer-item[b-e00a7vs5dr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    background: #f9fafb;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s;
}

.performer-item:hover[b-e00a7vs5dr] {
    background: #f3f4f6;
}

.performer-rank[b-e00a7vs5dr] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 600;
    flex-shrink: 0;
}

.performer-rank.top[b-e00a7vs5dr] {
    background: #d1fae5;
    color: #065f46;
}

.performer-rank.bottom[b-e00a7vs5dr] {
    background: #fef3c7;
    color: #92400e;
}

.performer-info[b-e00a7vs5dr] {
    flex: 1;
    min-width: 0;
}

.performer-name[b-e00a7vs5dr] {
    display: block;
    font-weight: 500;
    font-size: 0.9rem;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.performer-distributor[b-e00a7vs5dr] {
    display: block;
    font-size: 0.75rem;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.performer-metrics[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.25rem;
}

.performer-payout[b-e00a7vs5dr] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #10b981;
}

.performer-payout.low[b-e00a7vs5dr] {
    color: #f59e0b;
}

.performer-pod[b-e00a7vs5dr] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #004F3C;
}

.performer-pod.low[b-e00a7vs5dr] {
    color: #f59e0b;
}

.performer-cost[b-e00a7vs5dr] {
    font-size: 0.75rem;
    color: #6b7280;
}

.performer-cost.low[b-e00a7vs5dr] {
    color: #dc2626;
}

.performer-region[b-e00a7vs5dr] {
    font-size: 0.7rem;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    background: #e5e7eb;
    color: #4b5563;
}

/* Distributors Section */
.distributors-section[b-e00a7vs5dr] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.section-header[b-e00a7vs5dr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-header h3[b-e00a7vs5dr] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.section-actions[b-e00a7vs5dr] {
    display: flex;
    gap: 0.75rem;
}

.search-input[b-e00a7vs5dr] {
    border-radius: 6px;
}

/* Programs Section */
.programs-section[b-e00a7vs5dr] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* Grid Styles */
.distributors-grid[b-e00a7vs5dr],
.programs-grid[b-e00a7vs5dr] {
    border-radius: 8px;
    overflow: hidden;
}

.payout-value[b-e00a7vs5dr] {
    font-weight: 600;
    color: #10b981;
}

.bero-payout[b-e00a7vs5dr] {
    color: var(--rz-primary);
    font-weight: 500;
}

.dist-payout[b-e00a7vs5dr] {
    color: #3b82f6;
    font-weight: 500;
}

/* Status Badges */
.status-badge[b-e00a7vs5dr] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.status-badge.status-active[b-e00a7vs5dr] {
    background: #d1fae5;
    color: #065f46;
}

.status-badge.status-completed[b-e00a7vs5dr] {
    background: #e5e7eb;
    color: #374151;
}

.status-badge.status-cancelled[b-e00a7vs5dr] {
    background: #fee2e2;
    color: #991b1b;
}

.status-badge.status-upcoming[b-e00a7vs5dr] {
    background: #fef3c7;
    color: #92400e;
}

/* Region Badges */
.region-badge[b-e00a7vs5dr] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
    background: #e5e7eb;
    color: #374151;
}

.region-badge.region-southeast[b-e00a7vs5dr] { background: #dbeafe; color: #1e40af; }
.region-badge.region-northeast[b-e00a7vs5dr] { background: #fce7f3; color: #9d174d; }
.region-badge.region-northwest[b-e00a7vs5dr] { background: #d1fae5; color: #065f46; }
.region-badge.region-southwest[b-e00a7vs5dr] { background: #fef3c7; color: #92400e; }
.region-badge.region-south-central[b-e00a7vs5dr] { background: #e9d5ff; color: #6b21a8; }
.region-badge.region-north-central[b-e00a7vs5dr] { background: #cffafe; color: #155e75; }

/* Program Name Cell */
.program-name-cell[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
}

.program-name[b-e00a7vs5dr] {
    font-weight: 500;
    color: #111827;
}

.program-id[b-e00a7vs5dr] {
    font-size: 0.7rem;
    color: #9ca3af;
}

/* Date Cell */
.date-cell[b-e00a7vs5dr] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.days-badge[b-e00a7vs5dr] {
    font-size: 0.7rem;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    background: #e5e7eb;
    color: #374151;
    width: fit-content;
}

.days-badge.ending-soon[b-e00a7vs5dr] {
    background: #fef3c7;
    color: #92400e;
}

/* Data Bar Cells */
.data-bar-cell[b-e00a7vs5dr] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    min-height: 24px;
    padding: 2px 0;
}

.data-bar[b-e00a7vs5dr] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.data-bar-value[b-e00a7vs5dr] {
    position: relative;
    z-index: 1;
    font-size: 0.8rem;
    font-weight: 500;
    padding-right: 4px;
}

.data-bar-value-center[b-e00a7vs5dr] {
    padding-right: 0;
    width: 100%;
    text-align: center;
}

/* Data bar colors with subtle opacity */
.data-bar-green[b-e00a7vs5dr] {
    background: rgba(16, 185, 129, 0.25);
}

.data-bar-blue[b-e00a7vs5dr] {
    background: rgba(59, 130, 246, 0.25);
}

.data-bar-purple[b-e00a7vs5dr] {
    background: rgba(139, 92, 246, 0.25);
}

.data-bar-teal[b-e00a7vs5dr] {
    background: rgba(0, 79, 60, 0.2);
}

.data-bar-yellow[b-e00a7vs5dr] {
    background: rgba(245, 158, 11, 0.25);
}

/* Responsive */
@media (max-width: 1200px) {
    .performers-section[b-e00a7vs5dr] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .incentive-dashboard-container[b-e00a7vs5dr] {
        padding: 1rem;
    }

    .page-header[b-e00a7vs5dr] {
        flex-direction: column;
        gap: 1rem;
    }

    .filters-row[b-e00a7vs5dr] {
        flex-direction: column;
        align-items: stretch;
    }

    .filter-group[b-e00a7vs5dr] {
        width: 100%;
    }

    .filter-actions[b-e00a7vs5dr] {
        margin-left: 0;
        justify-content: flex-end;
    }

    .kpi-cards-section[b-e00a7vs5dr] {
        grid-template-columns: repeat(2, 1fr);
    }

    .charts-row[b-e00a7vs5dr] {
        grid-template-columns: 1fr;
    }

    .alert-cards-section[b-e00a7vs5dr] {
        flex-direction: column;
    }
}
/* /Components/Pages/OnPremiseDashboard.razor.rz.scp.css */
/* On Premise Dashboard Styles */

.on-premise-dashboard-container[b-l41ee1m5vz] {
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    min-height: 100vh;
}

/* Page Header */
.page-header[b-l41ee1m5vz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.header-content h1[b-l41ee1m5vz] {
    margin: 0 0 0.25rem 0;
    color: var(--rz-primary);
    font-size: 1.75rem;
}

.header-content p[b-l41ee1m5vz] {
    margin: 0;
    color: #6b7280;
    font-size: 0.95rem;
}

.header-actions[b-l41ee1m5vz] {
    display: flex;
    gap: 0.75rem;
}

.action-btn-primary[b-l41ee1m5vz] {
    background: var(--rz-primary) !important;
}

.action-btn-secondary[b-l41ee1m5vz] {
    border-color: var(--rz-primary) !important;
    color: var(--rz-primary) !important;
}

/* Dashboard Tabs */
.dashboard-tabs[b-l41ee1m5vz] {
    margin-top: 1rem;
}

.dashboard-tabs[b-l41ee1m5vz]  .rz-tabview-nav {
    border-bottom: 2px solid #e5e7eb;
    margin-bottom: 1.5rem;
}

.dashboard-tabs[b-l41ee1m5vz]  .rz-tabview-nav li a {
    font-weight: 500;
    color: #6b7280;
    padding: 0.75rem 1.5rem;
}

.dashboard-tabs[b-l41ee1m5vz]  .rz-tabview-nav li.rz-state-active a {
    color: var(--rz-primary);
    border-bottom: 3px solid var(--rz-primary);
}

/* Filters Section */
.filters-section[b-l41ee1m5vz] {
    background: white;
    border-radius: 12px;
    padding: 0;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.filters-header[b-l41ee1m5vz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s;
}

.filters-header:hover[b-l41ee1m5vz] {
    background: #f9fafb;
}

.filters-title[b-l41ee1m5vz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    color: #374151;
}

.filters-title[b-l41ee1m5vz]  .rzi {
    font-size: 1.1rem;
    color: #6b7280;
}

.active-filter-badge[b-l41ee1m5vz] {
    background: var(--rz-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
}

.expand-icon[b-l41ee1m5vz] {
    color: #9ca3af;
    transition: transform 0.2s;
}

.filters-row[b-l41ee1m5vz] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    padding: 0 1.25rem 1rem 1.25rem;
    border-top: 1px solid #f3f4f6;
    padding-top: 1rem;
}

.filter-group[b-l41ee1m5vz] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.filter-group label[b-l41ee1m5vz] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-actions[b-l41ee1m5vz] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

/* KPI Cards */
.kpi-cards-section[b-l41ee1m5vz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.kpi-card[b-l41ee1m5vz] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s, box-shadow 0.2s;
}

.kpi-card:hover[b-l41ee1m5vz] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.kpi-icon[b-l41ee1m5vz] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.kpi-icon[b-l41ee1m5vz]  .rzi {
    font-size: 1.5rem;
}

.focus-accounts-card .kpi-icon[b-l41ee1m5vz] { color: #004F3C; }
.new-accounts-card .kpi-icon[b-l41ee1m5vz] { color: #0ea5e9; }
.l12m-cases-card .kpi-icon[b-l41ee1m5vz] { color: #3b82f6; }
.l90-cases-card .kpi-icon[b-l41ee1m5vz] { color: #8b5cf6; }
.total-surveys-card .kpi-icon[b-l41ee1m5vz] { color: #f59e0b; }
.l90-surveys-card .kpi-icon[b-l41ee1m5vz] { color: #10b981; }

/* Highlight card for primary KPI */
.highlight-card[b-l41ee1m5vz] {
    background: linear-gradient(135deg, #004F3C 0%, #006B52 100%);
    border: 2px solid #004F3C;
}

.highlight-card .kpi-icon[b-l41ee1m5vz],
.highlight-card .kpi-value[b-l41ee1m5vz],
.highlight-card .kpi-label[b-l41ee1m5vz] {
    color: white !important;
}

.highlight-card .kpi-breakdown[b-l41ee1m5vz] {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.highlight-card .breakdown-item[b-l41ee1m5vz] {
    color: rgba(255, 255, 255, 0.9);
}

.kpi-content[b-l41ee1m5vz] {
    display: flex;
    flex-direction: column;
}

.kpi-value[b-l41ee1m5vz] {
    font-size: 1.75rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.2;
}

.kpi-label[b-l41ee1m5vz] {
    font-size: 0.8rem;
    color: #6b7280;
    margin-top: 0.25rem;
}

.kpi-breakdown[b-l41ee1m5vz] {
    display: flex;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f3f4f6;
}

.breakdown-item[b-l41ee1m5vz] {
    font-size: 0.75rem;
    color: #6b7280;
}

/* Charts Section */
.charts-row[b-l41ee1m5vz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.chart-card[b-l41ee1m5vz] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.chart-card h3[b-l41ee1m5vz] {
    margin: 0 0 0.25rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.chart-hint[b-l41ee1m5vz] {
    margin: 0 0 0.5rem 0;
    font-size: 0.7rem;
    color: #9ca3af;
    font-style: italic;
}

/* Clickable chart - cursor for donut segments */
.status-chart[b-l41ee1m5vz]  .apexcharts-pie-series path {
    cursor: pointer;
}

.no-data[b-l41ee1m5vz] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: #9ca3af;
    font-size: 0.9rem;
}

/* Employee Section */
.employee-section[b-l41ee1m5vz] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.employee-section.section-filtered[b-l41ee1m5vz] {
    border: 2px solid var(--rz-primary);
    box-shadow: 0 2px 8px rgba(0, 79, 60, 0.15);
}

.section-title-group[b-l41ee1m5vz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.employee-filter-badge[b-l41ee1m5vz] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: linear-gradient(135deg, #004F3C 0%, #006B52 100%);
    color: white;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.3rem 0.5rem 0.3rem 0.6rem;
    border-radius: 16px;
    white-space: nowrap;
}

.employee-filter-badge[b-l41ee1m5vz]  .rzi {
    font-size: 0.8rem;
}

.clear-filter-x[b-l41ee1m5vz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 0.25rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: background 0.15s;
}

.clear-filter-x:hover[b-l41ee1m5vz] {
    background: rgba(255, 255, 255, 0.35);
}

.clear-filter-x[b-l41ee1m5vz]  .rzi {
    font-size: 0.7rem;
}

.clear-filter-btn[b-l41ee1m5vz] {
    border-color: var(--rz-primary) !important;
    color: var(--rz-primary) !important;
}

.employee-grid[b-l41ee1m5vz] {
    border-radius: 8px;
    overflow: hidden;
}

.employee-grid[b-l41ee1m5vz]  .rz-column-title {
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.2;
}

/* Employee Cell with Avatar */
.employee-cell[b-l41ee1m5vz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.employee-avatar[b-l41ee1m5vz] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.employee-avatar img[b-l41ee1m5vz] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar-placeholder[b-l41ee1m5vz] {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #004F3C 0%, #006B52 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
}

.employee-name[b-l41ee1m5vz] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Clickable employee cell */
.employee-clickable[b-l41ee1m5vz] {
    cursor: pointer;
    padding: 0.25rem;
    margin: -0.25rem;
    border-radius: 6px;
    transition: background 0.15s ease;
}

.employee-clickable:hover[b-l41ee1m5vz] {
    background: rgba(0, 79, 60, 0.08);
}

.employee-clickable:hover .employee-avatar[b-l41ee1m5vz] {
    box-shadow: 0 0 0 2px var(--rz-primary);
}

.employee-clickable:active[b-l41ee1m5vz] {
    background: rgba(0, 79, 60, 0.15);
}

/* Footer Totals */
.footer-total[b-l41ee1m5vz] {
    font-weight: 700;
    font-size: 0.85rem;
    color: #004F3C;
}

.footer-total-label[b-l41ee1m5vz] {
    font-weight: 600;
    font-size: 0.8rem;
    color: #374151;
}

/* Accounts Section */
.accounts-section[b-l41ee1m5vz] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.section-header[b-l41ee1m5vz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-header h3[b-l41ee1m5vz] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.section-actions[b-l41ee1m5vz] {
    display: flex;
    gap: 0.75rem;
}

.search-input[b-l41ee1m5vz] {
    border-radius: 6px;
}

/* Grid Styles */
.accounts-grid[b-l41ee1m5vz] {
    border-radius: 8px;
    overflow: hidden;
}

/* Column header wrapping - defined in global site.css */

/* Account Name Cell */
.account-name-cell[b-l41ee1m5vz] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.account-name[b-l41ee1m5vz] {
    font-weight: 500;
    font-size: 0.8rem;
    color: #111827;
    line-height: 1.2;
}

.account-location[b-l41ee1m5vz] {
    font-size: 0.7rem;
    color: #9ca3af;
    line-height: 1.1;
}

.account-id-link[b-l41ee1m5vz] {
    color: var(--rz-primary);
    cursor: pointer;
    text-decoration: underline;
    font-weight: 500;
}

.account-id-link:hover[b-l41ee1m5vz] {
    color: #006B52;
}

/* Data Bar Cells */
.data-bar-cell[b-l41ee1m5vz] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    min-height: 24px;
    padding: 2px 0;
}

.data-bar[b-l41ee1m5vz] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.data-bar-value[b-l41ee1m5vz] {
    position: relative;
    z-index: 1;
    font-size: 0.8rem;
    font-weight: 500;
    padding-right: 4px;
}

.data-bar-value-center[b-l41ee1m5vz] {
    padding-right: 0;
    width: 100%;
    text-align: center;
}

/* Data bar colors with subtle opacity */
.data-bar-green[b-l41ee1m5vz] {
    background: rgba(16, 185, 129, 0.25);
}

.data-bar-blue[b-l41ee1m5vz] {
    background: rgba(59, 130, 246, 0.25);
}

.data-bar-purple[b-l41ee1m5vz] {
    background: rgba(139, 92, 246, 0.25);
}

.data-bar-yellow[b-l41ee1m5vz] {
    background: rgba(245, 158, 11, 0.25);
}

.data-bar-orange[b-l41ee1m5vz] {
    background: rgba(249, 115, 22, 0.3);
}

.data-bar-red[b-l41ee1m5vz] {
    background: rgba(239, 68, 68, 0.3);
}

/* Status Badges */
.status-badge[b-l41ee1m5vz] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.status-badge.status-active[b-l41ee1m5vz] {
    background: #d1fae5;
    color: #065f46;
}

.status-badge.status-prospect[b-l41ee1m5vz] {
    background: #e5e7eb;
    color: #374151;
}

.status-badge.status-won[b-l41ee1m5vz] {
    background: #fef3c7;
    color: #92400e;
}

.status-badge.status-churned[b-l41ee1m5vz] {
    background: #fee2e2;
    color: #991b1b;
}

.status-badge.status-inactive[b-l41ee1m5vz] {
    background: #e5e7eb;
    color: #374151;
}

.status-badge.status-default[b-l41ee1m5vz] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Cases styling */
.cases-high[b-l41ee1m5vz] {
    font-weight: 600;
    color: #10b981;
}

.cases-medium[b-l41ee1m5vz] {
    font-weight: 500;
    color: #3b82f6;
}

.cases-low[b-l41ee1m5vz] {
    color: #f59e0b;
}

.cases-none[b-l41ee1m5vz] {
    color: #9ca3af;
}

/* Days Since styling */
.days-recent[b-l41ee1m5vz] {
    color: #10b981;
    font-weight: 500;
}

.days-moderate[b-l41ee1m5vz] {
    color: #f59e0b;
}

.days-warning[b-l41ee1m5vz] {
    color: #f97316;
    font-weight: 500;
}

.days-overdue[b-l41ee1m5vz] {
    color: #ef4444;
    font-weight: 600;
}

/* Frequency styling */
.freq-high[b-l41ee1m5vz] {
    color: #10b981;
    font-weight: 500;
}

.freq-medium[b-l41ee1m5vz] {
    color: #f59e0b;
}

.freq-low[b-l41ee1m5vz] {
    color: #ef4444;
}

/* Survey styling */
.surveys-high[b-l41ee1m5vz] {
    color: #10b981;
    font-weight: 600;
}

.surveys-medium[b-l41ee1m5vz] {
    color: #3b82f6;
    font-weight: 500;
}

.surveys-none[b-l41ee1m5vz] {
    color: #9ca3af;
}

/* No value placeholder */
.no-value[b-l41ee1m5vz] {
    color: #d1d5db;
}

/* Placeholder Content */
.placeholder-content[b-l41ee1m5vz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    color: #6b7280;
    text-align: center;
    padding: 3rem;
}

.placeholder-content h2[b-l41ee1m5vz] {
    margin: 1rem 0 0.5rem 0;
    color: #374151;
}

.placeholder-content p[b-l41ee1m5vz] {
    margin: 0;
    font-size: 1rem;
}

/* On Premise Tab - All Accounts Card */
.all-accounts-card .kpi-icon[b-l41ee1m5vz] { color: #3b82f6; }

/* Focus/Non-Focus Badges */
.focus-badge[b-l41ee1m5vz] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    background-color: rgba(0, 79, 60, 0.1);
    color: #004F3C;
    border: 1px solid rgba(0, 79, 60, 0.3);
}

.non-focus-badge[b-l41ee1m5vz] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    background-color: rgba(156, 163, 175, 0.15);
    color: #6b7280;
    border: 1px solid rgba(156, 163, 175, 0.3);
}

/* Comparison Chart Card */
.comparison-chart[b-l41ee1m5vz] {
    grid-column: span 1;
}

/* New Accounts Chart Card */
.new-accounts-chart[b-l41ee1m5vz] {
    grid-column: span 1;
}

/* 5 charts layout for On Premise tab - 3 on top, 2 on bottom centered */
.charts-row:has(.new-accounts-chart)[b-l41ee1m5vz] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1.5rem;
}

.charts-row:has(.new-accounts-chart) .chart-card[b-l41ee1m5vz] {
    grid-column: span 2;
}

/* Center the last 2 charts on the second row */
.charts-row:has(.new-accounts-chart) .comparison-chart[b-l41ee1m5vz] {
    grid-column: 2 / span 2;
}

.charts-row:has(.new-accounts-chart) .new-accounts-chart[b-l41ee1m5vz] {
    grid-column: 4 / span 2;
}

/* Responsive */
@media (max-width: 1200px) {
    .charts-row[b-l41ee1m5vz] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .on-premise-dashboard-container[b-l41ee1m5vz] {
        padding: 1rem;
    }

    .page-header[b-l41ee1m5vz] {
        flex-direction: column;
        gap: 1rem;
    }

    .filters-row[b-l41ee1m5vz] {
        flex-direction: column;
        align-items: stretch;
    }

    .filter-group[b-l41ee1m5vz] {
        width: 100%;
    }

    .filter-actions[b-l41ee1m5vz] {
        margin-left: 0;
        justify-content: flex-end;
    }

    .kpi-cards-section[b-l41ee1m5vz] {
        grid-template-columns: repeat(2, 1fr);
    }

    .charts-row[b-l41ee1m5vz] {
        grid-template-columns: 1fr;
    }
}

/* Header Title Row with Info Button */
.header-title-row[b-l41ee1m5vz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-title-row h1[b-l41ee1m5vz] {
    margin: 0 0 0.25rem 0;
}

.info-btn[b-l41ee1m5vz] {
    padding: 0.25rem;
    min-width: auto;
    border-radius: 50%;
    opacity: 0.7;
    transition: opacity 0.2s;
}

.info-btn:hover[b-l41ee1m5vz] {
    opacity: 1;
}

/* Help Panel */
.help-panel[b-l41ee1m5vz] {
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfeff 100%);
    border: 1px solid #86efac;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}

.help-panel-header[b-l41ee1m5vz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.help-panel-header[b-l41ee1m5vz]  .rz-icon,
.help-panel-header[b-l41ee1m5vz]  .rzi {
    color: var(--rz-primary);
    font-size: 1.1rem;
}

.help-panel-header strong[b-l41ee1m5vz] {
    flex: 1;
    color: var(--rz-text-color);
    font-size: 1rem;
}

.help-close-btn[b-l41ee1m5vz] {
    margin-left: auto;
}

.help-panel > p[b-l41ee1m5vz] {
    margin: 0 0 0.75rem;
    color: #374151;
    font-size: 0.9rem;
    line-height: 1.5;
}

.help-panel ul[b-l41ee1m5vz] {
    margin: 0 0 0.75rem;
    padding-left: 1.25rem;
}

.help-panel li[b-l41ee1m5vz] {
    margin-bottom: 0.35rem;
    font-size: 0.85rem;
    color: #4b5563;
    line-height: 1.4;
}

.help-panel li strong[b-l41ee1m5vz] {
    color: #111827;
}

.help-tip[b-l41ee1m5vz] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0.75rem 0 0 0 !important;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(0, 79, 60, 0.15);
    font-size: 0.85rem !important;
    color: #4b5563 !important;
}

.help-tip[b-l41ee1m5vz]  .rz-icon,
.help-tip[b-l41ee1m5vz]  .rzi {
    color: #f59e0b;
    font-size: 1rem;
}
/* /Components/Pages/OrderB2B.razor.rz.scp.css */
/* OrderB2B Modern Styles */
.order-b2b-container[b-fe7276nuwn] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px 40px;
    font-family: 'ABCWhyte', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Loading Overlay */
.loading-overlay[b-fe7276nuwn] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    backdrop-filter: blur(4px);
}

.loading-content[b-fe7276nuwn] {
    text-align: center;
    color: white;
}

.loading-spinner[b-fe7276nuwn] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top-color: #004F3C;
    border-radius: 50%;
    animation: spin-b-fe7276nuwn 1s linear infinite;
    margin: 0 auto 16px;
}

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

.loading-content p[b-fe7276nuwn] {
    font-size: 16px;
    margin: 0;
}

/* Banner Area */
.banner-area[b-fe7276nuwn] {
    margin-bottom: 24px;
    border-radius: 16px;
    overflow: hidden;
}

.banner-image[b-fe7276nuwn] {
    width: 100%;
    height: auto;
    max-height: 200px;
    object-fit: cover;
    display: block;
}

/* Page Header */
.page-header[b-fe7276nuwn] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #e5e7eb;
}

.header-left h1[b-fe7276nuwn] {
    font-size: 32px;
    font-weight: 700;
    color: #004F3C;
    margin: 0 0 8px 0;
}

.header-subtitle[b-fe7276nuwn] {
    font-size: 15px;
    color: #6b7280;
    margin: 0;
}

.draft-badge[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f3f4f6;
    padding: 10px 16px;
    border-radius: 8px;
    color: #374151;
    font-weight: 500;
    font-size: 14px;
}

.draft-badge .rzi[b-fe7276nuwn] {
    color: #004F3C;
}

/* Order Content */
.order-content[b-fe7276nuwn] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Info Cards Row */
.info-cards-row[b-fe7276nuwn] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

/* Info Card */
.info-card[b-fe7276nuwn] {
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.card-header[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: #fafafa;
    border-bottom: 1px solid #e5e7eb;
}

.card-header .rzi[b-fe7276nuwn] {
    font-size: 24px;
    color: #004F3C;
}

.card-header h3[b-fe7276nuwn] {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.card-body[b-fe7276nuwn] {
    padding: 16px 20px;
}

/* Form Elements */
.form-group[b-fe7276nuwn] {
    margin-bottom: 12px;
}

.form-group:last-child[b-fe7276nuwn] {
    margin-bottom: 0;
}

.form-group label[b-fe7276nuwn] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 4px;
}

.form-group.full-width[b-fe7276nuwn] {
    width: 100%;
}

.form-row[b-fe7276nuwn] {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
}

.form-row:last-child[b-fe7276nuwn] {
    margin-bottom: 0;
}

.form-row.two-col .form-group[b-fe7276nuwn] {
    flex: 1;
}

.form-row.three-col .form-group[b-fe7276nuwn] {
    flex: 1;
}

/* Sales Contact Card */
.sales-contact[b-fe7276nuwn] {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #e5e7eb;
}

.sales-contact label[b-fe7276nuwn] {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 10px;
}

.contact-card[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px;
    background: #f9fafb;
    border-radius: 10px;
}

.contact-avatar[b-fe7276nuwn] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

.contact-info[b-fe7276nuwn] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.contact-name[b-fe7276nuwn] {
    font-weight: 600;
    color: #111827;
    font-size: 14px;
}

.contact-email[b-fe7276nuwn],
.contact-phone[b-fe7276nuwn] {
    font-size: 13px;
    color: #6b7280;
}

/* Pickup Location */
.pickup-location[b-fe7276nuwn] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pickup-address[b-fe7276nuwn] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    background: #f0fdf4;
    border-radius: 10px;
    border: 1px solid #bbf7d0;
}

.pickup-address .rzi[b-fe7276nuwn] {
    color: #16a34a;
    font-size: 24px;
}

.pickup-address strong[b-fe7276nuwn] {
    display: block;
    color: #111827;
    margin-bottom: 4px;
}

.pickup-address p[b-fe7276nuwn] {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
}

.pickup-map[b-fe7276nuwn] {
    width: 100%;
    height: 250px;
    border: none;
    border-radius: 10px;
}

/* MOQ Warning */
.moq-warning[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 20px;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-radius: 10px;
    color: #92400e;
    font-weight: 500;
}

.moq-warning .rzi[b-fe7276nuwn] {
    font-size: 20px;
}

/* Products Section */
.products-section[b-fe7276nuwn] {
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.section-header[b-fe7276nuwn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: #fafafa;
    border-bottom: 1px solid #e5e7eb;
}

.section-header h2[b-fe7276nuwn] {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.order-summary-pills[b-fe7276nuwn] {
    display: flex;
    gap: 8px;
}

.pill[b-fe7276nuwn] {
    padding: 6px 12px;
    background: #f3f4f6;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

.pill.total[b-fe7276nuwn] {
    background: #004F3C;
    color: white;
}

/* Empty State */
.empty-state[b-fe7276nuwn] {
    text-align: center;
    padding: 60px 20px;
    color: #6b7280;
}

.empty-state .rzi[b-fe7276nuwn] {
    font-size: 64px;
    color: #d1d5db;
    margin-bottom: 16px;
}

.empty-state h3[b-fe7276nuwn] {
    font-size: 18px;
    color: #374151;
    margin: 0 0 8px 0;
}

.empty-state p[b-fe7276nuwn] {
    margin: 0;
    font-size: 14px;
}

/* Products Grid */
.products-grid[b-fe7276nuwn] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 20px;
    padding: 20px;
}

/* Product Card - Vertical Layout */
.product-card[b-fe7276nuwn] {
    display: flex;
    flex-direction: column;
    padding: 20px;
    background: #fafafa;
    border-radius: 12px;
    border: 2px solid transparent;
    transition: all 0.2s ease;
    text-align: center;
}

.product-card.has-quantity[b-fe7276nuwn] {
    background: #f0fdf4;
    border-color: #86efac;
}

.product-image[b-fe7276nuwn] {
    width: 120px;
    height: 120px;
    margin: 0 auto 16px;
    border-radius: 10px;
    overflow: hidden;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.product-image img[b-fe7276nuwn] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product-info[b-fe7276nuwn] {
    flex: 1;
    margin-bottom: 16px;
}

.product-name[b-fe7276nuwn] {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
    margin: 0 0 6px 0;
    line-height: 1.4;
    min-height: 42px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-sku[b-fe7276nuwn] {
    font-size: 12px;
    color: #9ca3af;
    display: block;
    margin-bottom: 12px;
}

.product-pricing[b-fe7276nuwn] {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
}

.unit-price[b-fe7276nuwn] {
    font-size: 18px;
    font-weight: 700;
    color: #004F3C;
}

.pallet-info[b-fe7276nuwn] {
    font-size: 12px;
    color: #6b7280;
    background: #e5e7eb;
    padding: 3px 8px;
    border-radius: 4px;
}

.product-quantity[b-fe7276nuwn] {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding-top: 16px;
    border-top: 1px solid #e5e7eb;
    margin-top: auto;
}

.product-quantity label[b-fe7276nuwn] {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.product-quantity[b-fe7276nuwn]  .rz-spinner {
    max-width: 140px;
}

.product-quantity[b-fe7276nuwn]  .rz-spinner input {
    text-align: center;
    font-size: 16px;
    font-weight: 600;
}

.line-total[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 8px;
    padding: 8px 12px;
    background: rgba(0, 79, 60, 0.08);
    border-radius: 6px;
    width: 100%;
}

.line-total .pallets[b-fe7276nuwn] {
    font-size: 12px;
    color: #6b7280;
}

.line-total .amount[b-fe7276nuwn] {
    font-size: 16px;
    font-weight: 700;
    color: #004F3C;
}

/* Submit Section */
.submit-section[b-fe7276nuwn] {
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    padding: 20px;
}

.validation-messages[b-fe7276nuwn] {
    margin-bottom: 16px;
}

.validation-messages[b-fe7276nuwn]  .rz-message {
    color: #dc2626;
    font-size: 13px;
}

.submit-row[b-fe7276nuwn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.order-total[b-fe7276nuwn] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.total-label[b-fe7276nuwn] {
    font-size: 13px;
    color: #6b7280;
}

.total-amount[b-fe7276nuwn] {
    font-size: 28px;
    font-weight: 700;
    color: #004F3C;
}

.submit-btn[b-fe7276nuwn] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 14px 32px !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.25) !important;
    transition: all 0.2s ease !important;
}

.submit-btn:hover:not(:disabled)[b-fe7276nuwn] {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 79, 60, 0.35) !important;
}

.submit-btn:disabled[b-fe7276nuwn] {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* ===================== RESPONSIVE STYLES ===================== */

@media (max-width: 1024px) {
    .info-cards-row[b-fe7276nuwn] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .order-b2b-container[b-fe7276nuwn] {
        padding: 0 0px 32px;
    }

    /* Remove Radzen utility padding on mobile */
    [b-fe7276nuwn] .rz-px-4,
    [b-fe7276nuwn] .rz-pl-4 {
        padding-left: 0 !important;
    }

    [b-fe7276nuwn] .rz-px-4,
    [b-fe7276nuwn] .rz-pr-4 {
        padding-right: 0 !important;
    }

    /* Hide draft badge on mobile */
    .draft-badge[b-fe7276nuwn] {
        display: none;
    }

    /* Hide banner on mobile */
    .banner-area[b-fe7276nuwn] {
        display: none;
    }

    .page-header[b-fe7276nuwn] {
        flex-direction: column;
    }

    .header-left h1[b-fe7276nuwn] {
        font-size: 24px;
    }

    .draft-badge[b-fe7276nuwn] {
        align-self: flex-start;
    }

    .products-grid[b-fe7276nuwn] {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 16px;
        padding: 16px;
    }

    .product-card[b-fe7276nuwn] {
        padding: 16px;
    }

    .product-image[b-fe7276nuwn] {
        width: 100px;
        height: 100px;
        margin-bottom: 12px;
    }

    .product-name[b-fe7276nuwn] {
        font-size: 14px;
        min-height: 38px;
    }

    .unit-price[b-fe7276nuwn] {
        font-size: 16px;
    }

    .product-quantity[b-fe7276nuwn]  .rz-spinner {
        max-width: 130px;
    }

    .product-quantity[b-fe7276nuwn]  .rz-spinner input {
        height: 50px;
        font-size: 18px;
    }

    .product-quantity[b-fe7276nuwn]  .rz-numeric-button {
        height: 25px;
    }

    .line-total[b-fe7276nuwn] {
        flex-direction: row;
        justify-content: center;
        gap: 12px;
    }

    .submit-row[b-fe7276nuwn] {
        flex-direction: column;
        gap: 16px;
    }

    .order-total[b-fe7276nuwn] {
        align-items: center;
    }

    .submit-btn[b-fe7276nuwn] {
        width: 100%;
    }

    .section-header[b-fe7276nuwn] {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start;
    }

    .order-summary-pills[b-fe7276nuwn] {
        flex-wrap: wrap;
    }

    .form-row.three-col[b-fe7276nuwn] {
        flex-direction: column;
        gap: 16px;
    }

    .form-row.two-col[b-fe7276nuwn] {
        flex-direction: column;
        gap: 16px;
    }
}

@media (max-width: 480px) {
    .header-left h1[b-fe7276nuwn] {
        font-size: 20px;
    }

    .total-amount[b-fe7276nuwn] {
        font-size: 24px;
    }

    .card-header[b-fe7276nuwn] {
        padding: 12px 16px;
    }

    .card-body[b-fe7276nuwn] {
        padding: 16px;
    }

    .pill[b-fe7276nuwn] {
        padding: 4px 10px;
        font-size: 12px;
    }

    /* Single column on very small screens */
    .products-grid[b-fe7276nuwn] {
        grid-template-columns: 1fr;
    }

    .product-image[b-fe7276nuwn] {
        width: 90px;
        height: 90px;
    }
}

/* PWA Safe Area Support */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .order-b2b-container[b-fe7276nuwn] {
        padding-bottom: calc(40px + env(safe-area-inset-bottom));
    }
}

/* ===================== PROMOTIONS COLLAPSIBLE PANE ===================== */
.promotions-pane[b-fe7276nuwn] {
    background: white;
    border-radius: 16px;
    border: 2px solid #004F3C;
    overflow: hidden;
    margin-top: 24px;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.1);
    transition: all 0.3s ease;
}

.promotions-pane.collapsed[b-fe7276nuwn] {
    border-color: #e2e8f0;
}

.promotions-pane.expanded[b-fe7276nuwn] {
    border-color: #004F3C;
}

.promotions-pane-header[b-fe7276nuwn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: linear-gradient(135deg, #004F3C 0%, #006B52 100%);
    color: white;
    cursor: pointer;
    user-select: none;
    transition: all 0.2s ease;
}

.promotions-pane-header:hover[b-fe7276nuwn] {
    background: linear-gradient(135deg, #003d2e 0%, #005a45 100%);
}

.pane-header-left[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.pane-header-icon[b-fe7276nuwn] {
    font-size: 28px !important;
    color: #fbbf24;
}

.pane-header-text h3[b-fe7276nuwn] {
    margin: 0 0 2px 0;
    font-size: 18px;
    font-weight: 600;
}

.pane-header-text p[b-fe7276nuwn] {
    margin: 0;
    font-size: 13px;
    opacity: 0.85;
}

.pane-header-right[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.promo-count-badge[b-fe7276nuwn] {
    background: rgba(255, 255, 255, 0.2);
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
}

.expand-icon[b-fe7276nuwn] {
    font-size: 28px !important;
    transition: transform 0.3s ease;
}

.promotions-pane.collapsed .expand-icon[b-fe7276nuwn] {
    transform: rotate(0deg);
}

.promotions-pane.expanded .expand-icon[b-fe7276nuwn] {
    transform: rotate(180deg);
}

.promotions-pane-body[b-fe7276nuwn] {
    padding: 20px;
    background: #f8fafc;
    animation: slideDown-b-fe7276nuwn 0.3s ease;
}

@keyframes slideDown-b-fe7276nuwn {
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 2000px;
    }
}

.pane-intro[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    border-radius: 10px;
    margin-bottom: 20px;
    font-size: 14px;
    color: #047857;
}

.pane-intro[b-fe7276nuwn]  .rzi {
    font-size: 20px;
    color: #059669;
}

.promotions-grid[b-fe7276nuwn] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
}

/* Promotion Card */
.promo-card[b-fe7276nuwn] {
    background: white;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
}

.promo-card:hover[b-fe7276nuwn] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    border-color: #004F3C;
}

.promo-card-header[b-fe7276nuwn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background: #fafafa;
    border-bottom: 1px solid #e2e8f0;
}

.retailer-info[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.retailer-logo[b-fe7276nuwn] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    object-fit: contain;
    background: white;
    padding: 4px;
    border: 1px solid #e2e8f0;
}

.retailer-logo-placeholder[b-fe7276nuwn] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 24px;
}

.retailer-details[b-fe7276nuwn] {
    display: flex;
    flex-direction: column;
}

.retailer-name[b-fe7276nuwn] {
    font-weight: 600;
    color: #1e293b;
    font-size: 15px;
}

.retailer-region[b-fe7276nuwn] {
    font-size: 12px;
    color: #64748b;
}

.promo-type-badge[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: linear-gradient(135deg, #004F3C 0%, #006B52 100%);
    color: white;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.promo-type-badge[b-fe7276nuwn]  .rzi {
    font-size: 14px;
}

.promo-card-body[b-fe7276nuwn] {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.promo-title[b-fe7276nuwn] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.4;
}

.promo-description[b-fe7276nuwn] {
    margin: 0;
    font-size: 13px;
    color: #64748b;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.promo-dates[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #475569;
    flex-wrap: wrap;
}

.promo-dates[b-fe7276nuwn]  .rzi {
    color: #004F3C;
    font-size: 18px;
}

.days-badge[b-fe7276nuwn] {
    padding: 3px 10px;
    background: #fef3c7;
    color: #92400e;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
}

.days-badge.active[b-fe7276nuwn] {
    background: #dcfce7;
    color: #166534;
}

.promo-skus[b-fe7276nuwn] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    color: #475569;
    background: #f1f5f9;
    padding: 10px 12px;
    border-radius: 8px;
}

.promo-skus[b-fe7276nuwn]  .rzi {
    color: #004F3C;
    font-size: 18px;
    flex-shrink: 0;
}

/* Flavor Tiles - Grid Layout */
.promo-flavor-tiles[b-fe7276nuwn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
    gap: 10px;
    max-width: 100%;
}

.flavor-tile[b-fe7276nuwn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 5px 3px;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    transition: all 0.2s ease;
}

.flavor-tile:hover[b-fe7276nuwn] {
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
    border-color: #cbd5e1;
    transform: translateY(-1px);
}

.flavor-can-image[b-fe7276nuwn] {
    width: 40px;
    height: 40px;
    object-fit: contain;
    border-radius: 6px;
}

.flavor-icon-placeholder[b-fe7276nuwn] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 24px !important;
}

.flavor-name[b-fe7276nuwn] {
    font-size: 10px;
    font-weight: 500;
    color: #475569;
    text-align: center;
    line-height: 1.2;
    word-break: break-word;
    max-width: 100%;
}

.promo-stats[b-fe7276nuwn] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #e2e8f0;
}

.promo-stats .stat[b-fe7276nuwn] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #64748b;
}

.promo-stats .stat[b-fe7276nuwn]  .rzi {
    font-size: 16px;
    color: #94a3b8;
}

.promo-stats .stat.highlight[b-fe7276nuwn] {
    background: #dcfce7;
    color: #166534;
    padding: 4px 10px;
    border-radius: 6px;
    font-weight: 600;
}

.promo-stats .stat.highlight[b-fe7276nuwn]  .rzi {
    color: #16a34a;
}

.promo-image[b-fe7276nuwn] {
    height: 120px;
    overflow: hidden;
}

.promo-image img[b-fe7276nuwn] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Responsive Promotions Pane */
@media (max-width: 768px) {
    .promotions-pane[b-fe7276nuwn] {
        margin-top: 16px;
        border-radius: 12px;
    }

    .promotions-pane-header[b-fe7276nuwn] {
        padding: 14px 16px;
    }

    .pane-header-left[b-fe7276nuwn] {
        gap: 10px;
    }

    .pane-header-icon[b-fe7276nuwn] {
        font-size: 24px !important;
    }

    .pane-header-text h3[b-fe7276nuwn] {
        font-size: 16px;
    }

    .pane-header-text p[b-fe7276nuwn] {
        font-size: 12px;
    }

    .promotions-pane-body[b-fe7276nuwn] {
        padding: 16px;
    }

    .pane-intro[b-fe7276nuwn] {
        padding: 10px 12px;
        font-size: 13px;
        margin-bottom: 16px;
    }

    .promotions-grid[b-fe7276nuwn] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .promo-count-badge[b-fe7276nuwn] {
        padding: 3px 10px;
        font-size: 12px;
    }

    .expand-icon[b-fe7276nuwn] {
        font-size: 24px !important;
    }
}
/* /Components/Pages/Products.razor.rz.scp.css */
/* Products Page Styles */
.products-container[b-5ygmizx073] {
    max-width: 1600px;
    margin: 0 auto;
    font-family: 'ABCWhyte', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    padding: 0px;
}

/* Page Header */
.page-header[b-5ygmizx073] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
    padding: 20px;
    background: white;
    border-radius: 20px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    min-width: 350px;
}

.header-content h1[b-5ygmizx073] {
    margin: 0 0 8px 0;
    color: #111827;
    font-weight: 500;
    font-size: 32px;
}

.header-content p[b-5ygmizx073] {
    color: #6b7280;
    margin: 0;
    font-size: 16px;
}

.header-actions[b-5ygmizx073] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-shrink: 0;
}

.action-btn-primary[b-5ygmizx073] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.2) !important;
    transition: all 0.2s ease !important;
    min-height: 44px !important;
}

.action-btn-primary:hover[b-5ygmizx073] {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 79, 60, 0.3) !important;
}

.action-btn-secondary[b-5ygmizx073] {
    background: white !important;
    color: #6b7280 !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 12px 20px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    min-height: 44px !important;
}

.action-btn-secondary:hover[b-5ygmizx073] {
    background: #f9fafb !important;
    border-color: #004F3C !important;
    color: #004F3C !important;
}

/* Toolbar */
.toolbar-section[b-5ygmizx073] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding: 16px 24px;
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    flex-wrap: wrap;
    gap: 12px;
}

.toolbar-left[b-5ygmizx073] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.toolbar-right[b-5ygmizx073] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Product Stats */
.product-stats[b-5ygmizx073] {
    display: flex;
    gap: 8px;
}

.stat-badge[b-5ygmizx073] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    background: #f3f4f6;
    color: #6b7280;
}

.stat-badge.active[b-5ygmizx073] {
    background: #dcfce7;
    color: #166534;
}

.stat-badge[b-5ygmizx073]  .rz-icon {
    font-size: 14px;
}

/* Search */
.search-container[b-5ygmizx073] {
    position: relative;
    display: flex;
    align-items: center;
}

.search-container[b-5ygmizx073]  .search-input {
    padding-left: 36px;
    padding-right: 12px;
    width: 280px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    transition: all 0.2s ease;
}

.search-container[b-5ygmizx073]  .search-input:focus {
    border-color: #004F3C;
    box-shadow: 0 0 0 3px rgba(0, 79, 60, 0.1);
}

.search-container .search-icon[b-5ygmizx073] {
    position: absolute;
    left: 10px;
    color: #9ca3af;
    font-size: 20px;
    pointer-events: none;
}

/* Content Area */
.content-area[b-5ygmizx073] {
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    padding: 20px;
    min-height: 400px;
}

/* Products Grid */
.products-grid[b-5ygmizx073] {
    border-radius: 12px;
    overflow: hidden;
}

.products-grid[b-5ygmizx073]  .rz-data-grid {
    border: none;
}

.products-grid[b-5ygmizx073]  .rz-grid-table thead th {
    background: #f9fafb;
    font-weight: 600;
    color: #374151;
    border-bottom: 2px solid #e5e7eb;
}

.products-grid[b-5ygmizx073]  .rz-grid-table tbody tr:hover {
    background: #f9fafb;
}

.products-grid[b-5ygmizx073]  .rz-column-title-content {
    white-space: normal !important;
    word-break: normal !important;
}

/* Product Image */
.products-grid[b-5ygmizx073]  img {
    object-fit: contain;
    border-radius: 8px;
    background: #f9fafb;
}

/* Status Badge */
.status-badge[b-5ygmizx073] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.status-badge.active[b-5ygmizx073] {
    background: #dcfce7;
    color: #166534;
}

.status-badge.inactive[b-5ygmizx073] {
    background: #fee2e2;
    color: #991b1b;
}

/* Delete Button */
.products-grid[b-5ygmizx073]  .rz-button.rz-button-danger {
    border-radius: 8px;
    transition: all 0.2s ease;
}

.products-grid[b-5ygmizx073]  .rz-button.rz-button-danger:hover {
    transform: scale(1.05);
}

/* Responsive Styles */
@media (max-width: 768px) {
    .products-container[b-5ygmizx073] {
        padding: 0px;
    }

    .page-header[b-5ygmizx073] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        padding: 16px;
    }

    .header-actions[b-5ygmizx073] {
        width: 100%;
        justify-content: flex-start;
    }

    .toolbar-section[b-5ygmizx073] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }

    .toolbar-left[b-5ygmizx073],
    .toolbar-right[b-5ygmizx073] {
        width: 100%;
    }

    .search-container[b-5ygmizx073] {
        width: 100%;
    }

    .search-container[b-5ygmizx073]  .search-input {
        width: 100%;
    }

    .content-area[b-5ygmizx073] {
        padding: 12px;
        border-radius: 12px;
    }

    .hide-on-mobile[b-5ygmizx073] {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .page-header[b-5ygmizx073] {
        padding: 12px;
        border-radius: 12px;
    }

    .header-content h1[b-5ygmizx073] {
        font-size: 24px;
    }

    .header-content p[b-5ygmizx073] {
        font-size: 14px;
    }

    .toolbar-section[b-5ygmizx073] {
        border-radius: 12px;
    }

    .stat-badge[b-5ygmizx073] {
        font-size: 12px;
        padding: 4px 10px;
    }
}

/* Animation for content on load */
@keyframes fadeInUp-b-5ygmizx073 {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.page-header[b-5ygmizx073] {
    animation: fadeInUp-b-5ygmizx073 0.4s ease forwards;
}

.toolbar-section[b-5ygmizx073] {
    animation: fadeInUp-b-5ygmizx073 0.4s ease forwards;
    animation-delay: 0.1s;
}

.content-area[b-5ygmizx073] {
    animation: fadeInUp-b-5ygmizx073 0.4s ease forwards;
    animation-delay: 0.2s;
}
/* /Components/Pages/PromotionalCalendar.razor.rz.scp.css */
/* Promotional Calendar Styles */

/* Loading Overlay */
.spinner-overlay[b-ro7lit900a] {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    background: #201f1e;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    /* Escape parent transform/filter containing blocks */
    transform: translateZ(0);
}

.custom-loading[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.loading-gif[b-ro7lit900a] {
    width: 120px;
    height: 120px;
    object-fit: contain;
}

.loading-text[b-ro7lit900a] {
    color: white;
    font-size: 16px;
    font-weight: 500;
    margin: 0;
}

.promo-calendar-container[b-ro7lit900a] {
    max-width: 1800px;
    margin: 0 auto;
    padding: 0;
    font-family: 'ABCWhyte', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    height: calc(100vh - 80px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Page Header */
.page-header[b-ro7lit900a] {
    background: white;
    border-radius: 20px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    padding: 10px 24px;
    margin-bottom: 8px;
    flex-shrink: 0;
}

.header-content[b-ro7lit900a] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.header-left h1[b-ro7lit900a] {
    margin: 12px 0 8px 0;
    color: #111827;
    font-weight: 600;
    font-size: 28px;
}

.header-subtitle[b-ro7lit900a] {
    color: #6b7280;
    margin: 0;
    font-size: 15px;
}

.header-actions[b-ro7lit900a] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.action-btn-primary[b-ro7lit900a] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.2) !important;
    transition: all 0.2s ease !important;
}

.action-btn-primary:hover[b-ro7lit900a] {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 79, 60, 0.3) !important;
}

/* Mobile-only add button (hidden by default on desktop, shown on mobile) */
.header-actions[b-ro7lit900a]  .action-btn-mobile {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 50% !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    min-width: 44px !important;
    display: none !important; /* Hidden on desktop */
    box-shadow: 0 4px 16px rgba(0, 79, 60, 0.3) !important;
}

.header-actions[b-ro7lit900a]  .action-btn-mobile:hover {
    box-shadow: 0 6px 20px rgba(0, 79, 60, 0.4) !important;
}

/* Filter Toggle Button */
.filter-btn-wrapper[b-ro7lit900a] {
    position: relative;
    display: inline-flex;
}

.filter-toggle-btn[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 6px;
    border-radius: 8px !important;
}

.filter-toggle-btn.active[b-ro7lit900a] {
    background: #f0fdf4 !important;
    border-color: #004F3C !important;
    color: #004F3C !important;
}

.filter-count-badge[b-ro7lit900a] {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #f59e0b;
    color: white;
    font-size: 10px;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

/* Filter Sidebar */
.filter-sidebar[b-ro7lit900a] {
    width: 280px;
    min-width: 280px;
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 200px);
    position: sticky;
    top: 20px;
    animation: slideInLeft-b-ro7lit900a 0.3s ease;
    order: 1;
}

@keyframes slideInLeft-b-ro7lit900a {
    from {
        transform: translateX(-20px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.filter-sidebar-header[b-ro7lit900a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #e5e7eb;
    background: #fafafa;
    border-radius: 16px 16px 0 0;
}

.filter-sidebar-header h3[b-ro7lit900a] {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #111827;
}

.filter-sidebar-content[b-ro7lit900a] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.filter-sidebar-footer[b-ro7lit900a] {
    padding: 16px 20px;
    border-top: 1px solid #e5e7eb;
    background: #fafafa;
    border-radius: 0 0 16px 16px;
}

.filter-group[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.filter-group[b-ro7lit900a]  .rz-label {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Content Header */
.content-header[b-ro7lit900a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-bottom: 1px solid #e5e7eb;
    background: #fafafa;
    flex-shrink: 0;
}

.content-header-left[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.content-header-right[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Content Area */
.content-area[b-ro7lit900a] {
    display: flex;
    gap: 16px;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.content-area.with-promo-sidebar .main-content[b-ro7lit900a],
.content-area.with-filter-sidebar .main-content[b-ro7lit900a] {
    flex: 1;
    min-width: 0;
}

.main-content[b-ro7lit900a] {
    flex: 1;
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* Calendar Container */
.calendar-container[b-ro7lit900a] {
    padding: 20px;
}

.calendar-container[b-ro7lit900a]  .rz-scheduler {
    border: none;
}

/* Table Container */
.table-container[b-ro7lit900a] {
    padding: 16px;
}

.retailer-cell[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.retailer-logo[b-ro7lit900a] {
    width: 28px;
    height: 28px;
    object-fit: contain;
    border-radius: 4px;
}

/* Gantt Chart Styles */
.gantt-container[b-ro7lit900a] {
    padding: 20px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.gantt-header[b-ro7lit900a] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 20px;
    flex-shrink: 0;
    gap: 16px;
}

.gantt-navigation[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
}

.gantt-year[b-ro7lit900a] {
    font-size: 20px;
    font-weight: 600;
    color: #111827;
    min-width: 80px;
    text-align: center;
}

.gantt-range[b-ro7lit900a] {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    min-width: 180px;
    text-align: center;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.gantt-range:hover[b-ro7lit900a] {
    background: #f3f4f6;
    color: #004F3C;
}

.gantt-actions[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.gantt-chart[b-ro7lit900a] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.gantt-scroll-container[b-ro7lit900a] {
    overflow-x: auto;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
    position: relative;
}

/* Today line indicator */
.gantt-today-line[b-ro7lit900a] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #ef4444;
    z-index: 15;
    pointer-events: none;
}

.gantt-today-label[b-ro7lit900a] {
    position: absolute;
    top: 4px;
    left: 4px;
    background: #ef4444;
    color: white;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.3);
}

.gantt-timeline-header[b-ro7lit900a] {
    display: flex;
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%);
    color: white;
    position: sticky;
    top: 0;
    z-index: 10;
    width: fit-content;
}

.gantt-chain-header[b-ro7lit900a] {
    width: 200px;
    min-width: 200px;
    padding: 14px 16px;
    font-weight: 600;
    font-size: 13px;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    flex-shrink: 0;
    position: sticky;
    left: 0;
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%);
    z-index: 11;
}

.gantt-months[b-ro7lit900a] {
    display: flex;
    flex-shrink: 0;
}

.gantt-month[b-ro7lit900a] {
    padding: 14px 0;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    border-right: 1px solid rgba(255, 255, 255, 0.15);
    flex-shrink: 0;
}

.gantt-month:last-child[b-ro7lit900a] {
    border-right: none;
}

.gantt-body[b-ro7lit900a] {
    overflow: visible;
    width: fit-content;
}

.gantt-row[b-ro7lit900a] {
    display: flex;
    border-bottom: 1px solid #e5e7eb;
    min-height: 46px;
    width: fit-content;
}

.gantt-row:last-child[b-ro7lit900a] {
    border-bottom: none;
}

.gantt-row:hover .gantt-chain-cell[b-ro7lit900a],
.gantt-row:hover .gantt-bars-container[b-ro7lit900a] {
    background: #f9fafb;
}

.gantt-chain-cell[b-ro7lit900a] {
    width: 200px;
    min-width: 200px;
    padding: 8px 16px;
    border-right: 1px solid #e5e7eb;
    display: flex;
    align-items: flex-start;
    background: #fafafa;
    flex-shrink: 0;
    position: sticky;
    left: 0;
    z-index: 5;
}

.chain-info[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.chain-logo-small[b-ro7lit900a] {
    width: 32px;
    height: 32px;
    object-fit: contain;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
}

.chain-logo-placeholder[b-ro7lit900a] {
    width: 32px;
    height: 32px;
    background: #f3f4f6;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chain-logo-placeholder[b-ro7lit900a]  .rz-icon {
    font-size: 18px;
    color: #9ca3af;
}

.chain-name[b-ro7lit900a] {
    font-size: 13px;
    font-weight: 500;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
}

.gantt-bars-container[b-ro7lit900a] {
    position: relative;
    flex-shrink: 0;
    display: flex;
}

.gantt-month-cell[b-ro7lit900a] {
    flex-shrink: 0;
    border-right: 1px solid #e5e7eb;
    box-sizing: border-box;
}

.gantt-month-cell:last-child[b-ro7lit900a] {
    border-right: none;
}

.gantt-bars-overlay[b-ro7lit900a] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
}

.gantt-bars-overlay .gantt-bar[b-ro7lit900a] {
    pointer-events: auto;
}

.gantt-bar[b-ro7lit900a] {
    position: absolute;
    height: 28px;
    border-radius: 6px;
    padding: 4px 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.gantt-bar:hover[b-ro7lit900a] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 5;
}

.gantt-bar.status-planned[b-ro7lit900a] {
    background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%);
    color: white;
}

.gantt-bar.status-active[b-ro7lit900a] {
    background: linear-gradient(135deg, #22c55e 0%, #4ade80 100%);
    color: white;
}

.gantt-bar.status-completed[b-ro7lit900a] {
    background: linear-gradient(135deg, #6b7280 0%, #9ca3af 100%);
    color: white;
}

.gantt-bar.status-cancelled[b-ro7lit900a] {
    background: linear-gradient(135deg, #ef4444 0%, #f87171 100%);
    color: white;
}

.gantt-bar.status-default[b-ro7lit900a] {
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%);
    color: white;
}

.gantt-bar-content[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    height: 100%;
    justify-content: center;
}

.gantt-bar-title[b-ro7lit900a] {
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    line-height: 20px;
}

.gantt-empty[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #6b7280;
    grid-column: 1 / -1;
}

.gantt-empty[b-ro7lit900a]  .rz-icon {
    font-size: 48px;
    margin-bottom: 12px;
    opacity: 0.5;
}

/* Status Badges */
.status-badge[b-ro7lit900a] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: capitalize;
}

.status-planned[b-ro7lit900a] {
    background: #eef2ff;
    color: #4f46e5;
}

.status-active[b-ro7lit900a] {
    background: #dcfce7;
    color: #16a34a;
}

.status-completed[b-ro7lit900a] {
    background: #f3f4f6;
    color: #4b5563;
}

.status-cancelled[b-ro7lit900a] {
    background: #fef2f2;
    color: #dc2626;
}

.status-default[b-ro7lit900a] {
    background: #f0fdf4;
    color: #004f3c;
}

/* SKU Badge */
.sku-badge[b-ro7lit900a] {
    background: #dbeafe;
    color: #1d4ed8;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
}

/* Sidebar Styles */
.promotion-sidebar[b-ro7lit900a] {
    width: 420px;
    background: white;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 200px);
    position: sticky;
    top: 20px;
    animation: slideInRight-b-ro7lit900a 0.3s ease;
}

@keyframes slideInRight-b-ro7lit900a {
    from {
        transform: translateX(20px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.sidebar-header[b-ro7lit900a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%);
    border-radius: 16px 16px 0 0;
}

.sidebar-header h3[b-ro7lit900a] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: white;
}

.close-btn[b-ro7lit900a] {
    background: rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    border: none !important;
}

.close-btn:hover[b-ro7lit900a] {
    background: rgba(255, 255, 255, 0.3) !important;
}

.sidebar-content[b-ro7lit900a] {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}

.form-section[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.form-group[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-group[b-ro7lit900a]  .rz-label {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.form-group[b-ro7lit900a]  .rz-label.required::after {
    content: " *";
    color: #ef4444;
}

.form-row[b-ro7lit900a] {
    display: flex;
    gap: 16px;
}

.form-group.half[b-ro7lit900a] {
    flex: 1;
}

.help-text[b-ro7lit900a] {
    color: #9ca3af;
    font-size: 12px;
    margin-top: 4px;
}

/* SKU Dropdown Chips Styling */
.form-group[b-ro7lit900a]  .rz-dropdown-chips,
.form-group[b-ro7lit900a]  .rz-multiselect-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 4px;
    min-height: 38px;
    align-items: flex-start;
}

.form-group[b-ro7lit900a]  .rz-chip {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%);
    color: white;
    padding: 4px 8px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    margin: 2px;
    max-width: 200px;
}

.form-group[b-ro7lit900a]  .rz-chip .rz-chip-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.form-group[b-ro7lit900a]  .rz-chip .rz-chip-remove,
.form-group[b-ro7lit900a]  .rz-chip .rzi-times {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
    cursor: pointer;
    opacity: 0.8;
    font-size: 14px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    color: white !important;
}

.form-group[b-ro7lit900a]  .rz-chip .rz-chip-remove:hover,
.form-group[b-ro7lit900a]  .rz-chip .rzi-times:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.3);
}

.form-group[b-ro7lit900a]  .rz-dropdown-chips-wrapper {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

/* Selected SKUs Chips Container */
.selected-skus-chips[b-ro7lit900a] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
    padding: 8px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

.sku-chip[b-ro7lit900a] {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(135deg, #004F3C 0%, #337263 100%);
    color: white;
    padding: 6px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    gap: 6px;
    max-width: 200px;
}

.sku-chip-text[b-ro7lit900a] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sku-chip-remove[b-ro7lit900a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    cursor: pointer;
    padding: 0;
    color: white;
    transition: background 0.2s ease;
}

.sku-chip-remove:hover[b-ro7lit900a] {
    background: rgba(255, 255, 255, 0.4);
}

.sku-chip-remove[b-ro7lit900a]  .rzi {
    font-size: 12px;
    color: white !important;
}

.sidebar-footer[b-ro7lit900a] {
    display: flex;
    gap: 12px;
    padding: 20px 24px;
    border-top: 1px solid #e5e7eb;
    background: #fafafa;
    border-radius: 0 0 16px 16px;
}

/* Detail Modal */
.detail-modal-overlay[b-ro7lit900a] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    animation: fadeIn-b-ro7lit900a 0.2s ease;
    backdrop-filter: blur(4px);
}

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

.detail-modal[b-ro7lit900a] {
    background: white;
    border-radius: 20px;
    width: 90%;
    max-width: 600px;
    max-height: 85vh;
    overflow: hidden;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
    animation: modalSlideUp-b-ro7lit900a 0.3s ease;
}

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

.modal-header[b-ro7lit900a] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 24px;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #fafafa 0%, #f3f4f6 100%);
}

.modal-title-section[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.modal-title-section h2[b-ro7lit900a] {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    color: #111827;
}

.modal-close[b-ro7lit900a] {
    flex-shrink: 0;
}

.modal-body[b-ro7lit900a] {
    padding: 24px;
    overflow-y: auto;
    max-height: calc(85vh - 180px);
}

.detail-grid[b-ro7lit900a] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.detail-item[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.detail-label[b-ro7lit900a] {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-value[b-ro7lit900a] {
    font-size: 14px;
    font-weight: 500;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 8px;
}

.detail-chain-logo[b-ro7lit900a] {
    width: 24px;
    height: 24px;
    object-fit: contain;
    border-radius: 4px;
}

.detail-section[b-ro7lit900a] {
    margin-bottom: 20px;
    padding-top: 16px;
    border-top: 1px solid #e5e7eb;
}

.detail-section h4[b-ro7lit900a] {
    margin: 0 0 8px 0;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.detail-section p[b-ro7lit900a] {
    margin: 0;
    font-size: 14px;
    color: #4b5563;
    line-height: 1.6;
    white-space: pre-wrap;
}

.modal-footer[b-ro7lit900a] {
    display: flex;
    gap: 12px;
    padding: 20px 24px;
    border-top: 1px solid #e5e7eb;
    background: #fafafa;
    flex-wrap: wrap;
}

.onepager-btn[b-ro7lit900a] {
    background: linear-gradient(135deg, #059669 0%, #10b981 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.25) !important;
}

.onepager-btn:hover[b-ro7lit900a] {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(5, 150, 105, 0.35) !important;
}

/* Breadcrumb */
.custom-breadcrumb[b-ro7lit900a]  .rz-breadcrumb-item {
    font-size: 13px;
}

/* Responsive */
@media (max-width: 1200px) {
    .promotion-sidebar[b-ro7lit900a] {
        position: fixed;
        top: 0;
        right: 0;
        height: 100vh;
        max-height: 100vh;
        z-index: 1001;
        border-radius: 0;
        width: 400px;
    }

    .filter-sidebar[b-ro7lit900a] {
        position: fixed;
        top: 0;
        right: 0;
        height: 100vh;
        max-height: 100vh;
        z-index: 1000;
        border-radius: 0;
        width: 300px;
    }

    .filter-sidebar-header[b-ro7lit900a] {
        border-radius: 0;
    }

    .filter-sidebar-footer[b-ro7lit900a] {
        border-radius: 0;
    }

    .sidebar-header[b-ro7lit900a] {
        border-radius: 0;
    }

    .sidebar-footer[b-ro7lit900a] {
        border-radius: 0;
    }
}

/* ===================== MOBILE & PWA OPTIMIZATIONS ===================== */

@media (max-width: 768px) {
    .promo-calendar-container[b-ro7lit900a] {
        padding: 0;
        height: calc(100vh - 60px); /* Smaller header on mobile */
    }

    /* Compact page header for mobile */
    .page-header[b-ro7lit900a] {
        padding: 12px 16px;
        border-radius: 0;
        margin-bottom: 0;
        border-left: none;
        border-right: none;
        border-top: none;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
        position: sticky;
        top: 0;
        z-index: 100;
    }

    .header-content[b-ro7lit900a] {
        flex-direction: row;
        align-items: center;
        gap: 12px;
    }

    .header-left[b-ro7lit900a] {
        flex: 1;
        min-width: 0;
    }

    /* Hide breadcrumb on mobile */
    .header-left .custom-breadcrumb[b-ro7lit900a],
    .custom-breadcrumb[b-ro7lit900a],
    .header-left[b-ro7lit900a]  .rz-breadcrumb,
    [b-ro7lit900a] .rz-breadcrumb {
        display: none !important;
    }

    .header-left h1[b-ro7lit900a] {
        font-size: 18px;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Hide subtitle on mobile */
    .header-subtitle[b-ro7lit900a] {
        display: none;
    }

    /* Hide desktop button, show mobile icon-only button */
    .hide-on-mobile[b-ro7lit900a] {
        display: none !important;
    }

    .header-actions[b-ro7lit900a]  .action-btn-mobile {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Compact content header */
    .content-header[b-ro7lit900a] {
        padding: 10px 12px;
        flex-wrap: wrap;
        gap: 8px;
        background: #f9fafb;
        border-bottom: 1px solid #e5e7eb;
    }

    .content-header-left[b-ro7lit900a] {
        display: none !important;
    }

    .content-header-right[b-ro7lit900a] {
        order: 1;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 8px;
    }

    /* Hide sort dropdown label on mobile, icon only */
    .sort-dropdown-wrapper[b-ro7lit900a] {
        flex: 1;
        min-width: 0;
    }

    .sort-dropdown-wrapper .rz-dropdown[b-ro7lit900a] {
        width: 100% !important;
        max-width: 160px !important;
    }

    /* Compact filter button - icon only on mobile */
    .filter-btn-wrapper .filter-toggle-btn[b-ro7lit900a] {
        padding: 8px 10px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        width: 40px !important;
        height: 36px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .filter-btn-wrapper .filter-toggle-btn .rz-button-box[b-ro7lit900a] {
        gap: 0 !important;
    }

    .filter-btn-wrapper .filter-toggle-btn .rz-button-text[b-ro7lit900a] {
        display: none !important;
        width: 0 !important;
        overflow: hidden !important;
    }

    .filter-btn-wrapper .filter-toggle-btn .rzi[b-ro7lit900a] {
        margin: 0 !important;
        font-size: 20px !important;
    }

    /* Compact view toggle - icons only with proper centering */
    .content-header-right[b-ro7lit900a]  .rz-selectbar {
        gap: 2px !important;
    }

    .content-header-right[b-ro7lit900a]  .rz-selectbar-item {
        padding: 8px 10px !important;
        min-width: 40px !important;
        height: 36px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .content-header-right[b-ro7lit900a]  .rz-selectbar-item .rz-button-text {
        display: none !important;
    }

    .content-header-right[b-ro7lit900a]  .rz-selectbar-item .rzi {
        margin: 0 !important;
        font-size: 20px !important;
        line-height: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .content-header-right[b-ro7lit900a]  .rz-selectbar-item .rz-button-box {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
    }

    /* Full-screen filter sidebar */
    .filter-sidebar[b-ro7lit900a] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        max-height: 100vh;
        height: 100vh;
        border-radius: 0;
        z-index: 1002;
        animation: slideInFromBottom-b-ro7lit900a 0.3s ease;
    }

    @keyframes slideInFromBottom-b-ro7lit900a {
        from {
            transform: translateY(100%);
            opacity: 0;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }

    .filter-sidebar-header[b-ro7lit900a] {
        border-radius: 0;
        padding: 16px;
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .filter-sidebar-content[b-ro7lit900a] {
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .filter-group[b-ro7lit900a] {
        width: 100%;
    }

    .filter-group[b-ro7lit900a]  .rz-dropdown,
    .filter-group[b-ro7lit900a]  .rz-datepicker {
        width: 100% !important;
    }

    .sidebar-footer[b-ro7lit900a] {
        border-radius: 0;
        padding: 16px;
        position: sticky;
        bottom: 0;
        background: white;
        border-top: 1px solid #e5e7eb;
    }

    /* Calendar container adjustments */
    .calendar-container[b-ro7lit900a] {
        padding: 0;
    }

    .calendar-container[b-ro7lit900a]  .rz-scheduler {
        height: calc(100vh - 180px) !important;
        border-radius: 0;
    }

    /* Gantt adjustments */
    .gantt-container[b-ro7lit900a] {
        border-radius: 0;
    }

    .gantt-header[b-ro7lit900a] {
        padding: 10px 12px;
    }

    .gantt-navigation[b-ro7lit900a] {
        gap: 4px;
    }

    .gantt-range[b-ro7lit900a] {
        font-size: 13px;
        padding: 6px 10px;
    }

    .gantt-chain-cell[b-ro7lit900a] {
        width: 150px;
        min-width: 150px;
    }

    .chain-name[b-ro7lit900a] {
        max-width: 80px;
    }

    /* Promotion sidebar - bottom sheet style */
    .promotion-sidebar[b-ro7lit900a] {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        top: auto;
        width: 100%;
        max-height: 85vh;
        height: auto;
        border-radius: 20px 20px 0 0;
        z-index: 1003;
        animation: slideUpFromBottom-b-ro7lit900a 0.3s ease;
    }

    @keyframes slideUpFromBottom-b-ro7lit900a {
        from {
            transform: translateY(100%);
        }
        to {
            transform: translateY(0);
        }
    }

    .promotion-sidebar .sidebar-header[b-ro7lit900a] {
        border-radius: 20px 20px 0 0;
        padding: 16px;
    }

    /* Add drag handle for bottom sheet */
    .promotion-sidebar .sidebar-header[b-ro7lit900a]::before {
        content: '';
        position: absolute;
        top: 8px;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 4px;
        background: #d1d5db;
        border-radius: 2px;
    }

    .promotion-sidebar .sidebar-content[b-ro7lit900a] {
        max-height: calc(85vh - 140px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* ===================== DETAIL MODAL MOBILE OPTIMIZATIONS ===================== */
    .detail-modal-overlay[b-ro7lit900a] {
        align-items: flex-end;
        padding: 0;
    }

    .detail-modal[b-ro7lit900a] {
        width: 100%;
        max-width: 100%;
        max-height: 95vh;
        height: auto;
        border-radius: 20px 20px 0 0;
        display: flex;
        flex-direction: column;
        animation: modalSlideUpMobile-b-ro7lit900a 0.3s ease;
    }

    @keyframes modalSlideUpMobile-b-ro7lit900a {
        from {
            transform: translateY(100%);
            opacity: 0;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }

    /* Add drag handle indicator at top */
    .modal-header[b-ro7lit900a] {
        position: relative;
        padding: 20px 16px 16px 16px;
        flex-shrink: 0;
    }

    .modal-header[b-ro7lit900a]::before {
        content: '';
        position: absolute;
        top: 8px;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 4px;
        background: #d1d5db;
        border-radius: 2px;
    }

    .modal-title-section[b-ro7lit900a] {
        flex: 1;
        min-width: 0;
        padding-right: 40px;
    }

    .modal-title-section h2[b-ro7lit900a] {
        font-size: 18px;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    .modal-close[b-ro7lit900a] {
        position: absolute;
        top: 16px;
        right: 12px;
    }

    .modal-body[b-ro7lit900a] {
        flex: 1;
        padding: 16px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        max-height: none;
    }

    .detail-grid[b-ro7lit900a] {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        margin-bottom: 16px;
    }

    .detail-item[b-ro7lit900a] {
        gap: 2px;
    }

    .detail-label[b-ro7lit900a] {
        font-size: 10px;
    }

    .detail-value[b-ro7lit900a] {
        font-size: 13px;
    }

    .detail-section[b-ro7lit900a] {
        margin-bottom: 14px;
        padding-top: 12px;
    }

    .detail-section h4[b-ro7lit900a] {
        font-size: 12px;
        margin-bottom: 6px;
    }

    .detail-section p[b-ro7lit900a] {
        font-size: 13px;
    }

    .modal-footer[b-ro7lit900a] {
        padding: 12px 16px;
        gap: 8px;
        flex-shrink: 0;
        border-radius: 0;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .modal-footer .rz-button[b-ro7lit900a],
    .modal-footer .onepager-btn[b-ro7lit900a],
    .modal-footer .action-btn-primary[b-ro7lit900a] {
        flex: 1;
        min-width: 0;
        padding: 10px 8px !important;
        font-size: 12px !important;
        white-space: nowrap;
    }

    /* Hide button text on small screens, show icon only */
    .modal-footer .rz-button .rz-button-text[b-ro7lit900a] {
        display: none;
    }

    .modal-footer .rz-button .rzi[b-ro7lit900a] {
        margin: 0 !important;
        font-size: 18px !important;
    }

    /* Table view mobile adjustments */
    .table-container[b-ro7lit900a] {
        border-radius: 0;
    }

    .table-container[b-ro7lit900a]  .rz-datatable {
        font-size: 12px;
    }

    /* Overlay for sidebars */
    .content-area.with-filter-sidebar[b-ro7lit900a]::before,
    .content-area.with-promo-sidebar[b-ro7lit900a]::before {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 1001;
        animation: fadeIn-b-ro7lit900a 0.2s ease;
    }

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

@media (max-width: 480px) {
    .header-left h1[b-ro7lit900a] {
        font-size: 16px;
    }

    .header-actions .action-btn-primary[b-ro7lit900a] {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
    }

    .content-header[b-ro7lit900a] {
        padding: 8px 10px;
    }

    .gantt-chain-header[b-ro7lit900a],
    .gantt-chain-cell[b-ro7lit900a] {
        width: 100px;
        min-width: 100px;
    }

    .chain-logo-small[b-ro7lit900a] {
        display: none;
    }

    .gantt-range[b-ro7lit900a] {
        font-size: 12px;
        padding: 4px 8px;
    }

    /* Smaller navigation buttons */
    .gantt-navigation[b-ro7lit900a]  .rz-button {
        padding: 4px 6px !important;
        min-width: 28px !important;
    }

    .promotion-sidebar[b-ro7lit900a] {
        max-height: 90vh;
    }

    /* Extra small modal adjustments */
    .detail-modal[b-ro7lit900a] {
        max-height: 92vh;
    }

    .modal-title-section h2[b-ro7lit900a] {
        font-size: 16px;
    }

    .detail-grid[b-ro7lit900a] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .modal-footer[b-ro7lit900a] {
        padding: 10px 12px;
        gap: 6px;
    }

    .modal-footer .rz-button[b-ro7lit900a],
    .modal-footer .onepager-btn[b-ro7lit900a],
    .modal-footer .action-btn-primary[b-ro7lit900a] {
        padding: 8px 6px !important;
        font-size: 11px !important;
    }

    .modal-footer .rz-button .rzi[b-ro7lit900a] {
        font-size: 16px !important;
    }
}

/* PWA safe area support */
@supports (padding-top: env(safe-area-inset-top)) {
    @media (max-width: 768px) {
        .page-header[b-ro7lit900a] {
            padding-top: calc(12px + env(safe-area-inset-top));
        }

        .filter-sidebar[b-ro7lit900a] {
            padding-top: env(safe-area-inset-top);
        }

        .promotion-sidebar[b-ro7lit900a] {
            padding-bottom: env(safe-area-inset-bottom);
        }

        .sidebar-footer[b-ro7lit900a] {
            padding-bottom: calc(16px + env(safe-area-inset-bottom));
        }

        /* Modal safe area support */
        .detail-modal[b-ro7lit900a] {
            padding-bottom: env(safe-area-inset-bottom);
        }

        .modal-footer[b-ro7lit900a] {
            padding-bottom: calc(12px + env(safe-area-inset-bottom));
        }
    }
}

/* Execution Image Section in Sidebar */
.execution-image-section[b-ro7lit900a] {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}

.execution-uploading[b-ro7lit900a] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 24px;
    background: #f9fafb;
    color: #6b7280;
    font-size: 14px;
}

.execution-preview[b-ro7lit900a] {
    position: relative;
    background: #f9fafb;
    padding: 8px;
}

.execution-preview img[b-ro7lit900a] {
    width: 100%;
    max-height: 120px;
    object-fit: contain;
    border-radius: 6px;
}

.execution-actions[b-ro7lit900a] {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    gap: 4px;
}

.execution-actions[b-ro7lit900a]  .rz-button {
    background: rgba(255, 255, 255, 0.9) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Red delete button with visible icon */
.execution-actions[b-ro7lit900a]  .rz-button.rz-danger,
.execution-actions[b-ro7lit900a]  .rz-button-danger {
    background: #dc2626 !important;
    color: white !important;
}

.execution-actions[b-ro7lit900a]  .rz-button.rz-danger:hover,
.execution-actions[b-ro7lit900a]  .rz-button-danger:hover {
    background: #b91c1c !important;
}

.execution-actions[b-ro7lit900a]  .rz-button .rzi {
    color: inherit !important;
}

.execution-upload-zone[b-ro7lit900a] {
    position: relative;
    padding: 20px;
    text-align: center;
    background: #f9fafb;
    transition: all 0.2s ease;
    cursor: pointer;
}

.execution-upload-zone:hover[b-ro7lit900a] {
    background: #f0fdf4;
}

.execution-file-input[b-ro7lit900a] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.execution-upload-label[b-ro7lit900a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    pointer-events: none;
    color: #6b7280;
}

.execution-upload-label[b-ro7lit900a]  .rz-icon {
    font-size: 28px;
    color: #9ca3af;
}

.execution-upload-label span[b-ro7lit900a] {
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

/* Sort Dropdown */
.sort-dropdown-wrapper[b-ro7lit900a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 8px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.sort-dropdown-wrapper[b-ro7lit900a]  .rz-dropdown {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.sort-dropdown-wrapper[b-ro7lit900a]  .rz-dropdown .rz-inputtext {
    font-size: 11px;
    font-weight: 500;
    color: #374151;
    padding-left: 0 !important;
}

.sort-dropdown-wrapper[b-ro7lit900a]  .rz-dropdown .rz-dropdown-trigger {
    background: transparent;
}
/* /Components/Pages/SamplingDashboard.razor.rz.scp.css */
/* Sampling Dashboard Styles */

.sampling-dashboard-container[b-ngnknw4bz4] {
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    min-height: 100vh;
    min-height: 100dvh;
}

/* Page Header */
.page-header[b-ngnknw4bz4] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.header-content h1[b-ngnknw4bz4] {
    margin: 0 0 0.25rem 0;
    color: var(--rz-primary);
    font-size: 1.75rem;
}

.header-content p[b-ngnknw4bz4] {
    margin: 0;
    color: #6b7280;
    font-size: 0.95rem;
}

.header-actions[b-ngnknw4bz4] {
    display: flex;
    gap: 0.75rem;
}

.action-btn-primary[b-ngnknw4bz4] {
    background: var(--rz-primary) !important;
}

.action-btn-secondary[b-ngnknw4bz4] {
    border-color: var(--rz-primary) !important;
    color: var(--rz-primary) !important;
}

/* Dashboard Tabs */
.dashboard-tabs[b-ngnknw4bz4] {
    margin-top: 1rem;
}

.dashboard-tabs[b-ngnknw4bz4]  .rz-tabview-nav {
    border-bottom: 2px solid #e5e7eb;
    margin-bottom: 1.5rem;
}

.dashboard-tabs[b-ngnknw4bz4]  .rz-tabview-nav li a {
    font-weight: 500;
    color: #6b7280;
    padding: 0.75rem 1.5rem;
}

.dashboard-tabs[b-ngnknw4bz4]  .rz-tabview-nav li.rz-state-active a {
    color: var(--rz-primary);
    border-bottom: 3px solid var(--rz-primary);
}

/* Filters Section */
.filters-section[b-ngnknw4bz4] {
    background: white;
    border-radius: 12px;
    padding: 0;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.filters-header[b-ngnknw4bz4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s;
}

.filters-header:hover[b-ngnknw4bz4] {
    background: #f9fafb;
}

.filters-title[b-ngnknw4bz4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    color: #374151;
}

.filters-title[b-ngnknw4bz4]  .rzi {
    font-size: 1.1rem;
    color: #6b7280;
}

.active-filter-badge[b-ngnknw4bz4] {
    background: var(--rz-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
}

.expand-icon[b-ngnknw4bz4] {
    color: #9ca3af;
    transition: transform 0.2s;
}

.filters-row[b-ngnknw4bz4] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    padding: 0 1.25rem 1rem 1.25rem;
    border-top: 1px solid #f3f4f6;
    padding-top: 1rem;
}

.filter-group[b-ngnknw4bz4] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.filter-group label[b-ngnknw4bz4] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-actions[b-ngnknw4bz4] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

/* Date Range Picker */
.date-range-picker[b-ngnknw4bz4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.date-separator[b-ngnknw4bz4] {
    color: #9ca3af;
    font-size: 0.85rem;
}

/* KPI Cards */
.kpi-cards-section[b-ngnknw4bz4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.kpi-card[b-ngnknw4bz4] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s, box-shadow 0.2s;
}

.kpi-card:hover[b-ngnknw4bz4] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.kpi-icon[b-ngnknw4bz4] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.kpi-icon[b-ngnknw4bz4]  .rzi {
    font-size: 1.5rem;
}

.total-events-card .kpi-icon[b-ngnknw4bz4] { color: #004F3C; }
.confirmed-card .kpi-icon[b-ngnknw4bz4] { color: #10b981; }
.this-week-card .kpi-icon[b-ngnknw4bz4] { color: #3b82f6; }
.stores-card .kpi-icon[b-ngnknw4bz4] { color: #8b5cf6; }
.products-card .kpi-icon[b-ngnknw4bz4] { color: #f59e0b; }

/* Highlight card for primary KPI */
.highlight-card[b-ngnknw4bz4] {
    background: linear-gradient(135deg, #004F3C 0%, #006B52 100%);
    border: 2px solid #004F3C;
}

.highlight-card .kpi-icon[b-ngnknw4bz4],
.highlight-card .kpi-value[b-ngnknw4bz4],
.highlight-card .kpi-label[b-ngnknw4bz4] {
    color: white !important;
}

.highlight-card .kpi-breakdown[b-ngnknw4bz4] {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.highlight-card .breakdown-item[b-ngnknw4bz4] {
    color: rgba(255, 255, 255, 0.9);
}

.kpi-content[b-ngnknw4bz4] {
    display: flex;
    flex-direction: column;
}

.kpi-value[b-ngnknw4bz4] {
    font-size: 1.75rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.2;
}

.kpi-label[b-ngnknw4bz4] {
    font-size: 0.8rem;
    color: #6b7280;
    margin-top: 0.25rem;
}

.kpi-breakdown[b-ngnknw4bz4] {
    display: flex;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f3f4f6;
}

.breakdown-item[b-ngnknw4bz4] {
    font-size: 0.75rem;
    color: #6b7280;
}

/* Charts Section */
.charts-row[b-ngnknw4bz4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.chart-card[b-ngnknw4bz4] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.chart-card h3[b-ngnknw4bz4] {
    margin: 0 0 0.25rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

/* Chart header with toggle dropdown */
.chart-header-with-toggle[b-ngnknw4bz4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.chart-header-with-toggle h3[b-ngnknw4bz4] {
    margin: 0;
}

.chart-title-group[b-ngnknw4bz4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.time-filter-badge[b-ngnknw4bz4] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: #004F3C;
    color: white;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.3rem 0.6rem;
    border-radius: 9999px;
    animation: fadeIn-b-ngnknw4bz4 0.2s ease-in-out;
}

.time-filter-badge[b-ngnknw4bz4]  .rzi {
    font-size: 0.85rem;
}

.clear-filter-x[b-ngnknw4bz4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.25rem;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.clear-filter-x:hover[b-ngnknw4bz4] {
    opacity: 1;
}

.clear-filter-x[b-ngnknw4bz4]  .rzi {
    font-size: 0.75rem;
}

@keyframes fadeIn-b-ngnknw4bz4 {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}

.chart-filtered[b-ngnknw4bz4] {
    border: 2px solid #004F3C;
    box-shadow: 0 0 0 3px rgba(0, 79, 60, 0.1);
}

.chart-hint[b-ngnknw4bz4] {
    margin: 0 0 0.5rem 0;
    font-size: 0.7rem;
    color: #9ca3af;
    font-style: italic;
}

/* Weekly chart wider span */
.weekly-chart[b-ngnknw4bz4] {
    grid-column: span 2;
}

/* Clickable chart cursors */
.store-type-chart[b-ngnknw4bz4]  .apexcharts-pie-series path,
.product-chart[b-ngnknw4bz4]  .apexcharts-bar-area,
.weekly-chart[b-ngnknw4bz4]  .apexcharts-bar-area {
    cursor: pointer;
}

/* State Map Card - Full width for better visibility */
.state-map-card[b-ngnknw4bz4] {
    min-height: 400px;
    grid-column: 1 / -1; /* Span full width of grid */
}

.state-map-header[b-ngnknw4bz4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}

.state-map-header h3[b-ngnknw4bz4] {
    margin: 0;
}

.state-filter-badge[b-ngnknw4bz4] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: #3b82f6;
    color: white;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.3rem 0.6rem;
    border-radius: 9999px;
    animation: fadeIn-b-ngnknw4bz4 0.2s ease-in-out;
}

.state-filter-badge[b-ngnknw4bz4]  .rzi {
    font-size: 0.85rem;
}

.state-map-container[b-ngnknw4bz4] {
    height: 320px;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    background: #f9fafb;
}

/* Ensure Leaflet map renders properly */
.state-map-container .leaflet-container[b-ngnknw4bz4] {
    height: 100%;
    width: 100%;
    z-index: 1;
}

/* Ensure state polygon fills are visible */
.state-map-container .leaflet-overlay-pane svg[b-ngnknw4bz4] {
    pointer-events: auto;
}

.state-map-container .leaflet-overlay-pane svg path[b-ngnknw4bz4] {
    pointer-events: auto;
}

.state-map-legend[b-ngnknw4bz4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid #f3f4f6;
}

.legend-label[b-ngnknw4bz4] {
    font-size: 0.7rem;
    color: #6b7280;
}

.legend-gradient[b-ngnknw4bz4] {
    width: 120px;
    height: 10px;
    border-radius: 5px;
    background: linear-gradient(to right, #d1fae5, #004F3C);
}

/* State tooltip styling */
[b-ngnknw4bz4] .state-tooltip {
    background: white !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.8rem !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

[b-ngnknw4bz4] .state-tooltip::before {
    display: none !important;
}

.no-data[b-ngnknw4bz4] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: #9ca3af;
    font-size: 0.9rem;
}

/* Schedule Section */
.schedule-section[b-ngnknw4bz4] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.section-header[b-ngnknw4bz4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-header h3[b-ngnknw4bz4] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.section-actions[b-ngnknw4bz4] {
    display: flex;
    gap: 0.75rem;
}

.search-input[b-ngnknw4bz4] {
    border-radius: 6px;
}

/* Grid Styles */
.schedule-grid[b-ngnknw4bz4] {
    border-radius: 8px;
    overflow: hidden;
}

.schedule-grid[b-ngnknw4bz4]  .rz-column-title {
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.2;
}

/* Chain Badges */
.chain-badge[b-ngnknw4bz4] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
    white-space: nowrap;
}

.chain-badge.chain-kroger[b-ngnknw4bz4] {
    background: rgba(0, 102, 178, 0.15);
    color: #0066b2;
}

.chain-badge.chain-heb[b-ngnknw4bz4] {
    background: rgba(238, 49, 36, 0.12);
    color: #ee3124;
}

.chain-badge.chain-sprouts[b-ngnknw4bz4] {
    background: rgba(76, 175, 80, 0.15);
    color: #2e7d32;
}

.chain-badge.chain-absco[b-ngnknw4bz4] {
    background: rgba(245, 158, 11, 0.15);
    color: #d97706;
}

.chain-badge.chain-default[b-ngnknw4bz4] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Confirmed Badges */
.confirmed-badge[b-ngnknw4bz4] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.confirmed-badge.confirmed-yes[b-ngnknw4bz4] {
    background: #d1fae5;
    color: #065f46;
}

.confirmed-badge.confirmed-no[b-ngnknw4bz4] {
    background: #fee2e2;
    color: #991b1b;
}

/* Products Cell */
.products-cell[b-ngnknw4bz4] {
    font-size: 0.8rem;
    color: #374151;
    line-height: 1.3;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Placeholder Content */
.placeholder-content[b-ngnknw4bz4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    color: #6b7280;
    text-align: center;
    padding: 3rem;
}

.placeholder-content h2[b-ngnknw4bz4] {
    margin: 1rem 0 0.5rem 0;
    color: #374151;
}

.placeholder-content p[b-ngnknw4bz4] {
    margin: 0;
    font-size: 1rem;
}

/* Performance Tab Specific Styles */
.total-samples-card .kpi-icon[b-ngnknw4bz4] { color: #004F3C; }
.customers-card .kpi-icon[b-ngnknw4bz4] { color: #8b5cf6; }
.sales-card .kpi-icon[b-ngnknw4bz4] { color: #10b981; }
.roi-card .kpi-icon[b-ngnknw4bz4] { color: #3b82f6; }
.acquisition-card .kpi-icon[b-ngnknw4bz4] { color: #f59e0b; }

/* Performance chart full width */
.perf-trend-chart[b-ngnknw4bz4] {
    grid-column: span 2;
}

.store-perf-chart[b-ngnknw4bz4] {
    grid-column: span 1;
}

/* Responsive */
@media (max-width: 1400px) {
    .weekly-chart[b-ngnknw4bz4] {
        grid-column: span 1;
    }

    .perf-trend-chart[b-ngnknw4bz4] {
        grid-column: span 1;
    }
}

@media (max-width: 1200px) {
    .charts-row[b-ngnknw4bz4] {
        grid-template-columns: 1fr;
    }

    .weekly-chart[b-ngnknw4bz4] {
        grid-column: span 1;
    }
}

@media (max-width: 768px) {
    .sampling-dashboard-container[b-ngnknw4bz4] {
        padding: 0.75rem;
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0));
    }

    .page-header[b-ngnknw4bz4] {
        flex-direction: column;
        gap: 0.75rem;
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
    }

    .header-content h1[b-ngnknw4bz4] {
        font-size: 1.35rem;
    }

    .header-content p[b-ngnknw4bz4] {
        font-size: 0.85rem;
    }

    .header-actions[b-ngnknw4bz4] {
        width: 100%;
        justify-content: flex-end;
    }

    .header-actions[b-ngnknw4bz4]  .rz-button {
        min-height: 44px;
    }

    /* Tabs mobile */
    .dashboard-tabs[b-ngnknw4bz4]  .rz-tabview-nav {
        margin-bottom: 1rem;
    }

    .dashboard-tabs[b-ngnknw4bz4]  .rz-tabview-nav li a {
        padding: 0.6rem 1rem;
        font-size: 0.9rem;
    }

    /* Filters mobile */
    .filters-section[b-ngnknw4bz4] {
        margin-bottom: 1rem;
    }

    .filters-header[b-ngnknw4bz4] {
        padding: 0.6rem 1rem;
    }

    .filters-row[b-ngnknw4bz4] {
        flex-direction: column;
        align-items: stretch;
        padding: 0 1rem 0.75rem 1rem;
        gap: 0.75rem;
    }

    .filter-group[b-ngnknw4bz4] {
        width: 100%;
    }

    .filter-group[b-ngnknw4bz4]  .rz-dropdown,
    .filter-group[b-ngnknw4bz4]  .rz-datepicker {
        width: 100% !important;
    }

    .filter-group[b-ngnknw4bz4]  .rz-dropdown .rz-dropdown-trigger,
    .filter-group[b-ngnknw4bz4]  .rz-textbox {
        min-height: 44px;
    }

    .filter-actions[b-ngnknw4bz4] {
        margin-left: 0;
        justify-content: stretch;
        gap: 0.5rem;
        padding-top: 0.5rem;
    }

    .filter-actions[b-ngnknw4bz4]  .rz-button {
        flex: 1;
        min-height: 44px;
    }

    .date-range-picker[b-ngnknw4bz4] {
        flex-wrap: wrap;
        width: 100%;
    }

    .date-range-picker[b-ngnknw4bz4]  .rz-datepicker {
        flex: 1;
        min-width: 0;
    }

    /* KPI Cards mobile */
    .kpi-cards-section[b-ngnknw4bz4] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
        margin-bottom: 1rem;
    }

    .kpi-card[b-ngnknw4bz4] {
        padding: 1rem;
    }

    .kpi-value[b-ngnknw4bz4] {
        font-size: 1.5rem;
    }

    .kpi-label[b-ngnknw4bz4] {
        font-size: 0.75rem;
    }

    .kpi-breakdown[b-ngnknw4bz4] {
        margin-top: 0.5rem;
        padding-top: 0.5rem;
    }

    .breakdown-item[b-ngnknw4bz4] {
        font-size: 0.7rem;
    }

    /* Charts mobile */
    .charts-row[b-ngnknw4bz4] {
        grid-template-columns: 1fr;
        gap: 1rem;
        margin-bottom: 1rem;
    }

    .chart-card[b-ngnknw4bz4] {
        padding: 1rem;
    }

    .chart-card h3[b-ngnknw4bz4] {
        font-size: 0.95rem;
    }

    .chart-header-with-toggle[b-ngnknw4bz4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    /* State map mobile */
    .state-map-container[b-ngnknw4bz4] {
        height: 250px;
    }

    /* Schedule section mobile */
    .schedule-section[b-ngnknw4bz4] {
        padding: 1rem;
    }

    .section-header[b-ngnknw4bz4] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .section-actions[b-ngnknw4bz4] {
        width: 100%;
    }

    .search-input[b-ngnknw4bz4] {
        width: 100% !important;
    }

    .search-input[b-ngnknw4bz4]  .rz-textbox {
        width: 100%;
        min-height: 44px;
    }

    .schedule-grid[b-ngnknw4bz4] {
        height: 400px !important;
    }
}

/* Extra small screens */
@media (max-width: 375px) {
    .sampling-dashboard-container[b-ngnknw4bz4] {
        padding: 0.5rem;
        padding-bottom: calc(0.5rem + env(safe-area-inset-bottom, 0));
    }

    .header-content h1[b-ngnknw4bz4] {
        font-size: 1.2rem;
    }

    .kpi-cards-section[b-ngnknw4bz4] {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }

    .kpi-card[b-ngnknw4bz4] {
        padding: 0.75rem;
    }

    .kpi-value[b-ngnknw4bz4] {
        font-size: 1.25rem;
    }

    .kpi-icon[b-ngnknw4bz4] {
        font-size: 1.25rem;
        margin-bottom: 0.35rem;
    }

    .kpi-icon[b-ngnknw4bz4]  .rzi {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/StoreRocketManagement.razor.rz.scp.css */
.summary-card[b-y296rvd9ir] {
    padding: 0.75rem;
    text-align: center;
    min-height: 70px;
    transition: all 0.2s ease;
}

.summary-card:hover[b-y296rvd9ir] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.summary-card.selected[b-y296rvd9ir] {
    border: 2px solid var(--rz-primary);
    box-shadow: 0 4px 12px rgba(var(--rz-primary-rgb), 0.3);
    background-color: rgba(var(--rz-primary-rgb), 0.05);
}

.summary-card.synced[b-y296rvd9ir] {
    border-left: 3px solid var(--rz-success);
}

.summary-card.synced.selected[b-y296rvd9ir] {
    border: 2px solid var(--rz-success);
    box-shadow: 0 4px 12px rgba(var(--rz-success-rgb), 0.3);
    background-color: rgba(var(--rz-success-rgb), 0.05);
}

.summary-card.pending[b-y296rvd9ir] {
    border-left: 3px solid var(--rz-warning);
}

.summary-card.pending.selected[b-y296rvd9ir] {
    border: 2px solid var(--rz-warning);
    box-shadow: 0 4px 12px rgba(var(--rz-warning-rgb), 0.3);
    background-color: rgba(var(--rz-warning-rgb), 0.05);
}

.summary-card.failed[b-y296rvd9ir] {
    border-left: 3px solid var(--rz-danger);
}

.summary-card.failed.selected[b-y296rvd9ir] {
    border: 2px solid var(--rz-danger);
    box-shadow: 0 4px 12px rgba(var(--rz-danger-rgb), 0.3);
    background-color: rgba(var(--rz-danger-rgb), 0.05);
}

.summary-card.manual[b-y296rvd9ir] {
    border-left: 3px solid var(--rz-info);
}

.summary-card.manual.selected[b-y296rvd9ir] {
    border: 2px solid var(--rz-info);
    box-shadow: 0 4px 12px rgba(var(--rz-info-rgb), 0.3);
    background-color: rgba(var(--rz-info-rgb), 0.05);
}

.summary-card.excluded[b-y296rvd9ir] {
    border-left: 3px solid var(--rz-text-secondary-color);
}

.summary-card.excluded.selected[b-y296rvd9ir] {
    border: 2px solid var(--rz-text-secondary-color);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    background-color: rgba(0, 0, 0, 0.05);
}

[b-y296rvd9ir] .excluded-row {
    background-color: rgba(0, 0, 0, 0.05) !important;
    opacity: 0.7;
}

[b-y296rvd9ir] .excluded-row:hover {
    background-color: rgba(0, 0, 0, 0.08) !important;
}

[b-y296rvd9ir] .failed-row {
    background-color: rgba(var(--rz-danger-rgb), 0.05) !important;
}

[b-y296rvd9ir] .failed-row:hover {
    background-color: rgba(var(--rz-danger-rgb), 0.1) !important;
}

[b-y296rvd9ir] .matched-row {
    background-color: rgba(var(--rz-info-rgb), 0.05) !important;
}

[b-y296rvd9ir] .matched-row:hover {
    background-color: rgba(var(--rz-info-rgb), 0.1) !important;
}

[b-y296rvd9ir] .rz-datatable-thead th {
    font-weight: 600;
    background-color: var(--rz-base-200);
}

[b-y296rvd9ir] .rz-badge {
    font-size: 0.7rem;
    padding: 0.2rem 0.5rem;
}

@keyframes spin-b-y296rvd9ir {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
/* /Components/Pages/Talent/Analytics.razor.rz.scp.css */
/* Analytics Dashboard Styles */
.analytics-page[b-hd7cpqx8wu] {
    padding: 1rem;
    max-width: 1400px;
    margin: 0 auto;
    background: var(--rz-base-100);
    min-height: 100vh;
}

.page-header[b-hd7cpqx8wu] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.header-title-row[b-hd7cpqx8wu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-content h1[b-hd7cpqx8wu] {
    margin: 0;
    font-size: 1.5rem;
}

.header-content p[b-hd7cpqx8wu] {
    margin: 0.25rem 0 0;
    color: var(--rz-text-secondary-color);
    font-size: 0.875rem;
}

.date-range-filter[b-hd7cpqx8wu] {
    min-width: 160px;
}

.loading-container[b-hd7cpqx8wu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
}

/* Metrics Grid */
.metrics-grid[b-hd7cpqx8wu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.metric-card[b-hd7cpqx8wu] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.metric-icon[b-hd7cpqx8wu] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.metric-icon[b-hd7cpqx8wu]  .rz-icon {
    font-size: 28px;
    color: white;
}

.metric-icon.applications[b-hd7cpqx8wu] {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
}

.metric-icon.hired[b-hd7cpqx8wu] {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
}

.metric-icon.pipeline[b-hd7cpqx8wu] {
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
}

.metric-icon.time[b-hd7cpqx8wu] {
    background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
}

.metric-icon.rate[b-hd7cpqx8wu] {
    background: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%);
}

.metric-content[b-hd7cpqx8wu] {
    display: flex;
    flex-direction: column;
}

.metric-value[b-hd7cpqx8wu] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
}

.metric-value small[b-hd7cpqx8wu] {
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--rz-text-secondary-color);
}

.metric-label[b-hd7cpqx8wu] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    margin-top: 0.125rem;
}

/* Charts */
.charts-row[b-hd7cpqx8wu] {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
}

.charts-row.two-col[b-hd7cpqx8wu] {
    grid-template-columns: repeat(2, 1fr);
}

.chart-card[b-hd7cpqx8wu] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.chart-card.wide[b-hd7cpqx8wu] {
    grid-column: 1 / -1;
}

.chart-card.full-width[b-hd7cpqx8wu] {
    grid-column: 1 / -1;
}

.chart-header[b-hd7cpqx8wu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.chart-header h3[b-hd7cpqx8wu] {
    margin: 0;
}

.time-aggregation-toggle[b-hd7cpqx8wu]  .rz-selectbar {
    border-radius: 6px;
    overflow: hidden;
}

.time-aggregation-toggle[b-hd7cpqx8wu]  .rz-button {
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    min-width: auto;
}

.chart-card h3[b-hd7cpqx8wu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 600;
}

.chart-card h3[b-hd7cpqx8wu]  .rz-icon {
    font-size: 20px;
    color: var(--rz-primary);
}

.chart-container[b-hd7cpqx8wu] {
    height: 300px;
}

.chart-container[b-hd7cpqx8wu]  .rz-chart {
    height: 100%;
}

.empty-chart[b-hd7cpqx8wu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: var(--rz-text-disabled-color);
}

.empty-chart.small[b-hd7cpqx8wu] {
    height: 150px;
}

.empty-chart[b-hd7cpqx8wu]  .rz-icon {
    font-size: 48px;
    margin-bottom: 0.5rem;
}

.empty-chart p[b-hd7cpqx8wu] {
    margin: 0;
}

/* Source Effectiveness */
.source-list[b-hd7cpqx8wu] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.source-item[b-hd7cpqx8wu] {
    padding: 0.75rem;
    background: var(--rz-base-50);
    border-radius: 8px;
}

.source-header[b-hd7cpqx8wu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.source-name[b-hd7cpqx8wu] {
    font-weight: 600;
    font-size: 0.9rem;
}

.source-count[b-hd7cpqx8wu] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.source-bar-container[b-hd7cpqx8wu] {
    height: 8px;
    background: var(--rz-base-200);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.source-bar[b-hd7cpqx8wu] {
    height: 100%;
    background: var(--rz-primary-lighter);
    border-radius: 4px;
    position: relative;
}

.hired-segment[b-hd7cpqx8wu] {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    background: #22c55e;
    border-radius: 4px;
}

.source-stats[b-hd7cpqx8wu] {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
}

.source-stats .hired[b-hd7cpqx8wu] {
    color: #22c55e;
}

.source-stats .rate[b-hd7cpqx8wu] {
    color: var(--rz-text-secondary-color);
}

/* Pipeline Funnel */
.funnel-container[b-hd7cpqx8wu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.funnel-stage[b-hd7cpqx8wu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.stage-info[b-hd7cpqx8wu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stage-name[b-hd7cpqx8wu] {
    font-weight: 600;
    font-size: 0.875rem;
}

.stage-count[b-hd7cpqx8wu] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.funnel-bar-wrapper[b-hd7cpqx8wu] {
    height: 28px;
    background: var(--rz-base-100);
    border-radius: 6px;
    overflow: hidden;
}

.funnel-bar[b-hd7cpqx8wu] {
    height: 100%;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 0.5rem;
    min-width: 40px;
    transition: width 0.3s ease;
}

.current-count[b-hd7cpqx8wu] {
    font-size: 0.7rem;
    font-weight: 600;
    color: white;
    white-space: nowrap;
}

.stage-meta[b-hd7cpqx8wu] {
    display: flex;
    justify-content: flex-end;
}

.avg-days[b-hd7cpqx8wu] {
    font-size: 0.7rem;
    color: var(--rz-text-disabled-color);
}

/* Job Performance Table */
.job-table[b-hd7cpqx8wu] {
    overflow-x: auto;
}

.table-header[b-hd7cpqx8wu],
.table-row[b-hd7cpqx8wu] {
    display: grid;
    grid-template-columns: 1fr 100px 100px 100px 80px 80px 50px;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    align-items: center;
}

.table-header[b-hd7cpqx8wu] {
    background: var(--rz-base-50);
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rz-text-secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.table-row[b-hd7cpqx8wu] {
    border-bottom: 1px solid var(--rz-base-100);
}

.table-row:last-child[b-hd7cpqx8wu] {
    border-bottom: none;
}

.table-row:hover[b-hd7cpqx8wu] {
    background: var(--rz-base-50);
}

.col-job[b-hd7cpqx8wu] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-link[b-hd7cpqx8wu] {
    color: var(--rz-text-color);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

.job-link:hover[b-hd7cpqx8wu] {
    color: var(--rz-primary);
    text-decoration: underline;
}

.col-apps[b-hd7cpqx8wu],
.col-pipeline[b-hd7cpqx8wu],
.col-hired[b-hd7cpqx8wu],
.col-days[b-hd7cpqx8wu] {
    text-align: center;
}

.hired-count[b-hd7cpqx8wu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: #dcfce7;
    color: #166534;
    border-radius: 50%;
    font-weight: 600;
    font-size: 0.8rem;
}

.zero[b-hd7cpqx8wu] {
    color: var(--rz-text-disabled-color);
}

.days-badge[b-hd7cpqx8wu] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    background: var(--rz-base-100);
    border-radius: 4px;
    font-size: 0.8rem;
}

.days-badge.warning[b-hd7cpqx8wu] {
    background: #fef3c7;
    color: #92400e;
}

/* Responsive */
@media (max-width: 1024px) {
    .charts-row.two-col[b-hd7cpqx8wu] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .analytics-page[b-hd7cpqx8wu] {
        padding: 0.75rem;
    }

    .page-header[b-hd7cpqx8wu] {
        flex-direction: column;
    }

    .metrics-grid[b-hd7cpqx8wu] {
        grid-template-columns: repeat(2, 1fr);
    }

    .metric-card[b-hd7cpqx8wu] {
        padding: 1rem;
    }

    .metric-icon[b-hd7cpqx8wu] {
        width: 48px;
        height: 48px;
    }

    .metric-icon[b-hd7cpqx8wu]  .rz-icon {
        font-size: 24px;
    }

    .metric-value[b-hd7cpqx8wu] {
        font-size: 1.5rem;
    }

    .chart-container[b-hd7cpqx8wu] {
        height: 250px;
    }

    .table-header[b-hd7cpqx8wu],
    .table-row[b-hd7cpqx8wu] {
        grid-template-columns: 1fr 80px 60px 60px 50px 50px 40px;
        font-size: 0.75rem;
        padding: 0.5rem;
    }

    .col-status[b-hd7cpqx8wu]  .rz-badge {
        font-size: 0.65rem;
        padding: 0.125rem 0.375rem;
    }
}

@media (max-width: 480px) {
    .metrics-grid[b-hd7cpqx8wu] {
        grid-template-columns: 1fr;
    }

    .table-header[b-hd7cpqx8wu],
    .table-row[b-hd7cpqx8wu] {
        grid-template-columns: 1fr 60px 50px 40px;
    }

    .col-pipeline[b-hd7cpqx8wu],
    .col-days[b-hd7cpqx8wu],
    .col-action[b-hd7cpqx8wu] {
        display: none;
    }
}
/* /Components/Pages/Talent/Apply.razor.rz.scp.css */
/* Apply Page - Public Job Application */
.apply-page[b-luy4bdg6o5] {
    min-height: 100vh;
    background: var(--rz-base-100);
}

/* Loading */
.loading-container[b-luy4bdg6o5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    gap: 1rem;
}

/* Not Found */
.not-found[b-luy4bdg6o5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    text-align: center;
}

.not-found h2[b-luy4bdg6o5] {
    margin: 1rem 0 0.5rem;
    color: var(--rz-text-color);
}

.not-found p[b-luy4bdg6o5] {
    color: var(--rz-text-secondary-color);
    margin-bottom: 1.5rem;
}

/* Success State */
.success-container[b-luy4bdg6o5] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80vh;
    padding: 2rem;
}

.success-card[b-luy4bdg6o5] {
    background: white;
    border-radius: 16px;
    padding: 3rem;
    text-align: center;
    max-width: 500px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.success-icon[b-luy4bdg6o5] {
    width: 80px;
    height: 80px;
    background: #ecfdf5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
}

.success-icon[b-luy4bdg6o5]  .rz-icon {
    font-size: 3rem;
    color: #10b981;
}

.success-card h1[b-luy4bdg6o5] {
    font-size: 1.75rem;
    margin: 0 0 1rem;
    color: var(--rz-text-color);
}

.success-card p[b-luy4bdg6o5] {
    color: var(--rz-text-secondary-color);
    margin: 0.5rem 0;
    line-height: 1.6;
}

.success-actions[b-luy4bdg6o5] {
    margin-top: 2rem;
}

/* Back Bar */
.back-bar[b-luy4bdg6o5] {
    background: white;
    border-bottom: 1px solid var(--rz-base-200);
    padding: 1rem 2rem;
}

.back-link[b-luy4bdg6o5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--rz-text-secondary-color);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
}

.back-link:hover[b-luy4bdg6o5] {
    color: var(--rz-primary);
}

.back-link[b-luy4bdg6o5]  .rz-icon {
    font-size: 1.25rem;
}

/* Main Content Layout - Single Column Centered */
.apply-content[b-luy4bdg6o5] {
    max-width: 700px;
    margin: 0 auto;
    padding: 2rem;
}

/* Application Form - Primary Focus */
.application-form[b-luy4bdg6o5] {
    width: 100%;
}

/* Job Title Header */
.job-title-header[b-luy4bdg6o5] {
    background: linear-gradient(135deg, #004f3c 0%, #002e23 100%);
    color: white;
    padding: 2rem;
    border-radius: 12px 12px 0 0;
    text-align: center;
}

.job-title-header h1[b-luy4bdg6o5] {
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0 0 1rem;
}

.job-title-header .job-meta[b-luy4bdg6o5] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
}

.job-title-header .meta-item[b-luy4bdg6o5] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.9);
}

.job-title-header .meta-item[b-luy4bdg6o5]  .rz-icon {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.7);
}

.job-title-header .meta-item.remote[b-luy4bdg6o5] {
    background: rgba(255, 255, 255, 0.15);
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-weight: 500;
    color: white;
}

.job-title-header .meta-item.remote[b-luy4bdg6o5]  .rz-icon {
    color: white;
}

/* Collapsible Job Details */
.job-details-collapsible[b-luy4bdg6o5] {
    background: white;
    border-left: 1px solid var(--rz-base-200);
    border-right: 1px solid var(--rz-base-200);
}

.collapse-toggle[b-luy4bdg6o5] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--rz-base-100);
    border: none;
    border-bottom: 1px solid var(--rz-base-200);
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--rz-primary);
    transition: all 0.2s;
}

.collapse-toggle:hover[b-luy4bdg6o5] {
    background: var(--rz-base-200);
}

.collapse-toggle[b-luy4bdg6o5]  .rz-icon {
    font-size: 1.25rem;
}

.collapse-toggle.expanded[b-luy4bdg6o5] {
    border-bottom: none;
}

.job-details-content[b-luy4bdg6o5] {
    padding: 1.5rem;
    border-bottom: 1px solid var(--rz-base-200);
    background: white;
}

/* Job Sections */
.job-section[b-luy4bdg6o5] {
    margin-bottom: 1.5rem;
}

.job-section:last-child[b-luy4bdg6o5] {
    margin-bottom: 0;
}

.job-section h3[b-luy4bdg6o5] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
    color: var(--rz-text-color);
}

.rich-content[b-luy4bdg6o5] {
    color: var(--rz-text-secondary-color);
    line-height: 1.7;
    font-size: 0.9rem;
}

.rich-content ul[b-luy4bdg6o5],
.rich-content ol[b-luy4bdg6o5] {
    padding-left: 1.5rem;
    margin: 0.5rem 0;
}

.rich-content li[b-luy4bdg6o5] {
    margin: 0.5rem 0;
}

.rich-content p[b-luy4bdg6o5] {
    margin: 0.75rem 0;
}

/* Form Card */
.form-card[b-luy4bdg6o5] {
    background: white;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    border: 1px solid var(--rz-base-200);
    border-top: none;
}

.form-header[b-luy4bdg6o5] {
    background: var(--rz-base-100);
    padding: 1.5rem;
    text-align: center;
    border-bottom: 1px solid var(--rz-base-200);
}

.form-header h2[b-luy4bdg6o5] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 0.25rem;
    color: var(--rz-text-color);
}

.form-header p[b-luy4bdg6o5] {
    font-size: 0.9rem;
    color: var(--rz-text-secondary-color);
    margin: 0;
}

/* Form Sections */
.form-section[b-luy4bdg6o5] {
    padding: 1.5rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.form-section:last-of-type[b-luy4bdg6o5] {
    border-bottom: none;
}

.form-section h3[b-luy4bdg6o5] {
    font-size: 0.95rem;
    font-weight: 600;
    margin: 0 0 1rem;
    color: var(--rz-text-color);
}

/* Form Fields */
.form-row[b-luy4bdg6o5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-field[b-luy4bdg6o5] {
    margin-bottom: 1rem;
}

.form-field:last-child[b-luy4bdg6o5] {
    margin-bottom: 0;
}

.form-field[b-luy4bdg6o5]  .rz-label {
    display: block;
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: 0.35rem;
    color: var(--rz-text-color);
}

.form-field[b-luy4bdg6o5]  .rz-textbox,
.form-field[b-luy4bdg6o5]  .rz-textarea,
.form-field[b-luy4bdg6o5]  .rz-dropdown {
    border-radius: 8px;
}

/* File Upload */
.file-upload[b-luy4bdg6o5] {
    position: relative;
    border: 2px dashed var(--rz-base-300);
    border-radius: 8px;
    padding: 1.5rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s;
}

.file-upload:hover[b-luy4bdg6o5] {
    border-color: var(--rz-primary);
    background: rgba(0, 79, 60, 0.02);
}

.file-upload.has-file[b-luy4bdg6o5] {
    border-style: solid;
    border-color: #10b981;
    background: #ecfdf5;
}

.file-upload[b-luy4bdg6o5]  input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.upload-content[b-luy4bdg6o5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    pointer-events: none;
}

.upload-icon[b-luy4bdg6o5] {
    font-size: 2rem;
    color: var(--rz-text-tertiary-color);
}

.file-icon[b-luy4bdg6o5] {
    font-size: 1.5rem;
    color: #10b981;
}

.upload-content span[b-luy4bdg6o5] {
    font-size: 0.9rem;
    color: var(--rz-text-secondary-color);
}

.upload-content strong[b-luy4bdg6o5] {
    color: var(--rz-primary);
}

.upload-hint[b-luy4bdg6o5] {
    font-size: 0.8rem !important;
    color: var(--rz-text-tertiary-color) !important;
}

.file-name[b-luy4bdg6o5] {
    font-weight: 500;
    color: var(--rz-text-color) !important;
}

.file-size[b-luy4bdg6o5] {
    font-size: 0.8rem !important;
    color: var(--rz-text-tertiary-color) !important;
}

/* Validation Error */
.validation-error[b-luy4bdg6o5] {
    display: block;
    color: var(--rz-danger);
    font-size: 0.8rem;
    margin-top: 0.35rem;
}

/* Form Actions */
.form-actions[b-luy4bdg6o5] {
    padding: 1.5rem;
    background: var(--rz-base-100);
}

.submit-btn[b-luy4bdg6o5] {
    width: 100%;
}

/* Responsive */
@media (max-width: 640px) {
    .apply-content[b-luy4bdg6o5] {
        padding: 1rem;
    }

    .job-title-header[b-luy4bdg6o5] {
        padding: 1.5rem;
        border-radius: 8px 8px 0 0;
    }

    .job-title-header h1[b-luy4bdg6o5] {
        font-size: 1.5rem;
    }

    .job-title-header .job-meta[b-luy4bdg6o5] {
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
    }

    .form-card[b-luy4bdg6o5] {
        border-radius: 0 0 8px 8px;
    }

    .form-row[b-luy4bdg6o5] {
        grid-template-columns: 1fr;
    }

    .form-header[b-luy4bdg6o5] {
        padding: 1.25rem;
    }

    .form-section[b-luy4bdg6o5] {
        padding: 1.25rem;
    }

    .back-bar[b-luy4bdg6o5] {
        padding: 0.75rem 1rem;
    }

    .job-details-content[b-luy4bdg6o5] {
        padding: 1.25rem;
    }
}
/* /Components/Pages/Talent/BulkImport.razor.rz.scp.css */
/* Bulk Import Page Styles */
.bulk-import-page[b-hk2w4g3mha] {
    padding: 1rem;
    max-width: 1400px;
    margin: 0 auto;
    background: var(--rz-base-100);
    min-height: 100vh;
}

.page-header[b-hk2w4g3mha] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.header-content h1[b-hk2w4g3mha] {
    margin: 0;
    font-size: 1.5rem;
}

.header-content p[b-hk2w4g3mha] {
    margin: 0.25rem 0 0;
    color: var(--rz-text-secondary-color);
    font-size: 0.875rem;
}

/* Config Section */
.config-section[b-hk2w4g3mha] {
    margin-bottom: 1.5rem;
}

.config-card[b-hk2w4g3mha] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.config-card h3[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 600;
}

.config-card h3[b-hk2w4g3mha]  .rz-icon {
    font-size: 20px;
    color: var(--rz-primary);
}

.config-grid[b-hk2w4g3mha] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.config-field[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.config-field label[b-hk2w4g3mha] {
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--rz-text-color);
}

.config-field .required[b-hk2w4g3mha] {
    color: #ef4444;
}

.field-hint[b-hk2w4g3mha] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

/* Upload Section */
.upload-section[b-hk2w4g3mha] {
    margin-bottom: 1.5rem;
}

.upload-zone[b-hk2w4g3mha] {
    background: white;
    border: 2px dashed var(--rz-base-400);
    border-radius: 12px;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.upload-zone.dragging[b-hk2w4g3mha] {
    border-color: var(--rz-primary);
    background: var(--rz-primary-lighter);
    transform: scale(1.01);
}

.upload-zone.processing[b-hk2w4g3mha] {
    border-style: solid;
    border-color: #8b5cf6;
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
}

.upload-zone.disabled[b-hk2w4g3mha] {
    border-color: var(--rz-base-300);
    background: var(--rz-base-100);
    cursor: not-allowed;
}

.upload-disabled[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    text-align: center;
}

.upload-disabled .info-icon[b-hk2w4g3mha] {
    font-size: 48px !important;
    color: var(--rz-text-disabled-color);
}

.upload-disabled .disabled-text[b-hk2w4g3mha] {
    font-size: 1rem;
    color: var(--rz-text-secondary-color);
    margin: 0;
}

.upload-label[b-hk2w4g3mha] {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 200px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
}

.upload-label input[type="file"][b-hk2w4g3mha],
.upload-label[b-hk2w4g3mha]  input[type="file"],
.upload-label[b-hk2w4g3mha]  .mud-file-upload,
.upload-label[b-hk2w4g3mha]  input {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
    z-index: 10;
}

/* Hide any visible file input text/button */
.upload-label[b-hk2w4g3mha]  input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
}

.upload-label[b-hk2w4g3mha]  input[type="file"]::file-selector-button {
    visibility: hidden;
}

.upload-prompt[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    text-align: center;
    padding: 2rem;
}

.upload-icon[b-hk2w4g3mha] {
    font-size: 56px !important;
    color: var(--rz-primary);
    margin-bottom: 0.5rem;
}

.upload-text[b-hk2w4g3mha] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--rz-text-color);
    margin: 0;
}

.upload-or[b-hk2w4g3mha] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    margin: 0;
}

.upload-browse[b-hk2w4g3mha] {
    font-size: 0.95rem;
    color: var(--rz-primary);
    font-weight: 500;
}

.upload-formats[b-hk2w4g3mha] {
    font-size: 0.75rem;
    color: var(--rz-text-disabled-color);
    margin: 0.5rem 0 0;
}

/* Processing Overlay */
.processing-overlay[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 2rem;
}

.processing-overlay[b-hk2w4g3mha]  .rz-progressbar-circular {
    --rz-progressbar-circular-track-color: #e9d5ff;
    --rz-progressbar-circular-value-color: #8b5cf6;
}

.processing-text[b-hk2w4g3mha] {
    font-size: 1rem;
    font-weight: 600;
    color: #6d28d9;
    margin: 0;
}

.processing-subtext[b-hk2w4g3mha] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    margin: 0;
}

/* Upload Complete */
.upload-complete[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 2rem;
}

.upload-complete .success-icon[b-hk2w4g3mha] {
    font-size: 56px !important;
    color: #22c55e;
}

.upload-complete p[b-hk2w4g3mha] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--rz-text-color);
    margin: 0;
}

.add-more-label[b-hk2w4g3mha] {
    position: relative;
    cursor: pointer;
}

.add-more-label input[type="file"][b-hk2w4g3mha],
.add-more-label[b-hk2w4g3mha]  input[type="file"] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 10;
}

/* Review Section */
.review-section[b-hk2w4g3mha] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    margin-bottom: 1.5rem;
}

.review-header[b-hk2w4g3mha] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.review-header h3[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.review-header h3[b-hk2w4g3mha]  .rz-icon {
    font-size: 20px;
    color: var(--rz-primary);
}

.review-actions[b-hk2w4g3mha] {
    display: flex;
    gap: 0.5rem;
}

.select-all-row[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--rz-base-50);
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.duplicate-warning[b-hk2w4g3mha] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: #f59e0b;
    font-size: 0.8rem;
}

.duplicate-warning[b-hk2w4g3mha]  .rz-icon {
    font-size: 16px;
}

.existing-candidate-info[b-hk2w4g3mha] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: #3b82f6;
    font-size: 0.8rem;
}

.existing-candidate-info[b-hk2w4g3mha]  .rz-icon {
    font-size: 16px;
}

/* Candidates Grid */
.candidates-grid[b-hk2w4g3mha] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
}

.candidate-review-card[b-hk2w4g3mha] {
    background: var(--rz-base-50);
    border: 1px solid var(--rz-base-200);
    border-radius: 10px;
    padding: 1rem;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.candidate-review-card.selected[b-hk2w4g3mha] {
    border-color: var(--rz-primary);
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.candidate-review-card.duplicate[b-hk2w4g3mha] {
    border-color: #f59e0b;
}

.candidate-review-card.already-applied[b-hk2w4g3mha] {
    border-color: #ef4444;
    background: #fef2f2;
}

.candidate-review-card.existing-candidate[b-hk2w4g3mha] {
    border-color: #3b82f6;
    background: #eff6ff;
}

.candidate-review-card.imported[b-hk2w4g3mha] {
    opacity: 0.7;
}

.imported-overlay[b-hk2w4g3mha] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    z-index: 10;
    color: #22c55e;
}

.imported-overlay.scoring[b-hk2w4g3mha] {
    color: #6366f1;
    background: rgba(255, 255, 255, 0.92);
}

.imported-overlay.scoring[b-hk2w4g3mha]  .rz-progressbar-circular {
    --rz-progressbar-circular-track-color: #e0e7ff;
    --rz-progressbar-circular-value-color: #6366f1;
}

.imported-overlay.score-error[b-hk2w4g3mha] {
    color: #f59e0b;
}

.imported-overlay[b-hk2w4g3mha]  .rz-icon {
    font-size: 48px;
    margin-bottom: 0.5rem;
}

.imported-overlay span[b-hk2w4g3mha] {
    font-weight: 600;
}

.scoring-text[b-hk2w4g3mha] {
    color: #6366f1;
    animation: pulse-b-hk2w4g3mha 1.5s ease-in-out infinite;
}

@keyframes pulse-b-hk2w4g3mha {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

.fit-score[b-hk2w4g3mha] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.fit-score.score-high[b-hk2w4g3mha] {
    color: #16a34a;
}

.fit-score.score-medium[b-hk2w4g3mha] {
    color: #2563eb;
}

.fit-score.score-low[b-hk2w4g3mha] {
    color: #f59e0b;
}

.fit-score.score-poor[b-hk2w4g3mha] {
    color: #dc2626;
}

.error-text[b-hk2w4g3mha] {
    color: #f59e0b;
}

.card-header[b-hk2w4g3mha] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.card-status[b-hk2w4g3mha] {
    display: flex;
    gap: 0.25rem;
    align-items: center;
}

/* Ensure consistent badge height */
.card-status[b-hk2w4g3mha]  .rz-badge {
    height: 22px;
    line-height: 22px;
    padding: 0 0.5rem;
    font-size: 0.7rem;
}

.card-body[b-hk2w4g3mha] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    min-width: 0;
    overflow: hidden;
}

.candidate-avatar[b-hk2w4g3mha] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    font-weight: 600;
    flex-shrink: 0;
}

.candidate-info[b-hk2w4g3mha] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
    overflow: hidden;
}

.candidate-name[b-hk2w4g3mha] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--rz-text-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.candidate-email[b-hk2w4g3mha],
.candidate-phone[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    min-width: 0;
    overflow: hidden;
}

.candidate-email.no-email[b-hk2w4g3mha] {
    color: #f59e0b;
    font-style: italic;
}

.candidate-email.no-email[b-hk2w4g3mha]  .rz-icon {
    color: #f59e0b;
}

.candidate-email span[b-hk2w4g3mha],
.candidate-phone span[b-hk2w4g3mha] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.candidate-email[b-hk2w4g3mha]  .rz-icon,
.candidate-phone[b-hk2w4g3mha]  .rz-icon {
    font-size: 14px;
    flex-shrink: 0;
    color: var(--rz-text-disabled-color);
}

.card-details[b-hk2w4g3mha] {
    padding: 0.75rem;
    background: white;
    border-radius: 6px;
    margin-bottom: 0.75rem;
}

.detail-row[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    font-size: 0.75rem;
    margin-bottom: 0.375rem;
}

.detail-row:last-child[b-hk2w4g3mha] {
    margin-bottom: 0;
}

.detail-label[b-hk2w4g3mha] {
    color: var(--rz-text-secondary-color);
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.detail-value[b-hk2w4g3mha] {
    color: var(--rz-text-color);
    line-height: 1.3;
    word-break: break-word;
}

.skills-row[b-hk2w4g3mha] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.5rem;
}

.skill-tag[b-hk2w4g3mha] {
    padding: 0.125rem 0.5rem;
    background: var(--rz-base-100);
    border-radius: 4px;
    font-size: 0.7rem;
    color: var(--rz-text-secondary-color);
}

.skill-more[b-hk2w4g3mha] {
    padding: 0.125rem 0.5rem;
    font-size: 0.7rem;
    color: var(--rz-text-disabled-color);
}

.card-footer[b-hk2w4g3mha] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0.5rem;
    border-top: 1px solid var(--rz-base-200);
}

.file-name[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.file-name[b-hk2w4g3mha]  .rz-icon {
    font-size: 14px;
    flex-shrink: 0;
}

.file-name.clickable[b-hk2w4g3mha] {
    cursor: pointer;
    color: var(--rz-primary);
    text-decoration: none;
    transition: all 0.15s ease;
}

.file-name.clickable:hover[b-hk2w4g3mha] {
    color: var(--rz-primary-dark, #4338ca);
    text-decoration: underline;
}

.file-name.clickable[b-hk2w4g3mha]  .rz-icon {
    color: var(--rz-primary);
}

/* Remove button in card header */
.remove-btn[b-hk2w4g3mha] {
    margin-left: auto;
    opacity: 0.6;
    transition: opacity 0.15s ease;
}

.remove-btn:hover[b-hk2w4g3mha] {
    opacity: 1;
}

.remove-btn[b-hk2w4g3mha]  .rz-icon {
    font-size: 16px !important;
}

/* Results Section */
.results-section[b-hk2w4g3mha] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.results-header[b-hk2w4g3mha] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.results-header h3[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.results-header h3[b-hk2w4g3mha]  .rz-icon {
    font-size: 20px;
    color: #22c55e;
}

.results-actions[b-hk2w4g3mha] {
    display: flex;
    gap: 0.5rem;
}

.results-section h3[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 600;
}

.results-section h3[b-hk2w4g3mha]  .rz-icon {
    font-size: 20px;
    color: #22c55e;
}

.results-summary[b-hk2w4g3mha] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1rem;
}

.result-stat[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 2rem;
    border-radius: 8px;
}

.result-stat.success[b-hk2w4g3mha] {
    background: #dcfce7;
}

.result-stat.error[b-hk2w4g3mha] {
    background: #fee2e2;
}

.result-stat .stat-value[b-hk2w4g3mha] {
    font-size: 2rem;
    font-weight: 700;
}

.result-stat.success .stat-value[b-hk2w4g3mha] {
    color: #166534;
}

.result-stat.error .stat-value[b-hk2w4g3mha] {
    color: #991b1b;
}

.result-stat .stat-label[b-hk2w4g3mha] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.result-stat.ai-score[b-hk2w4g3mha] {
    background: linear-gradient(135deg, #ede9fe 0%, #e9d5ff 100%);
    border: 1px solid #c4b5fd;
}

.result-stat.ai-score .stat-value[b-hk2w4g3mha] {
    color: #6d28d9;
}

.result-stat.scoring[b-hk2w4g3mha] {
    background: var(--rz-base-100);
    justify-content: center;
    min-width: 100px;
}

.result-stat.scoring[b-hk2w4g3mha]  .rz-progressbar-circular {
    --rz-progressbar-circular-track-color: #e0e7ff;
    --rz-progressbar-circular-value-color: #6366f1;
}

.error-list[b-hk2w4g3mha] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.error-item[b-hk2w4g3mha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    background: #fee2e2;
    border-radius: 6px;
    font-size: 0.85rem;
    color: #991b1b;
}

.error-item[b-hk2w4g3mha]  .rz-icon {
    font-size: 18px;
    flex-shrink: 0;
}

/* Responsive */
@media (max-width: 1024px) {
    .config-grid[b-hk2w4g3mha] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .bulk-import-page[b-hk2w4g3mha] {
        padding: 0.75rem;
    }

    .page-header[b-hk2w4g3mha] {
        flex-direction: column;
    }

    .config-grid[b-hk2w4g3mha] {
        grid-template-columns: 1fr;
    }

    .candidates-grid[b-hk2w4g3mha] {
        grid-template-columns: 1fr;
    }

    .review-header[b-hk2w4g3mha] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: flex-start;
    }

    .review-actions[b-hk2w4g3mha] {
        width: 100%;
    }

    .review-actions[b-hk2w4g3mha]  .rz-button {
        flex: 1;
    }

    .results-summary[b-hk2w4g3mha] {
        width: 100%;
    }

    .result-stat[b-hk2w4g3mha] {
        flex: 1;
    }
}
/* /Components/Pages/Talent/CandidateProfile.razor.rz.scp.css */
/* Enhanced Candidate Profile Styles - Redesigned Layout */
.candidate-profile[b-qq2de4oebm] {
    max-width: 1400px;
    margin: 0 auto;
    background: var(--rz-base-100);
    min-height: 100vh;
}

.loading-container[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
}

.empty-state[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    background: white;
    border-radius: 12px;
}

/* Header Section - Contains header, summary, details */
.header-section[b-qq2de4oebm] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    margin-bottom: 1rem;
    overflow: hidden;
}

/* Header */
.profile-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.5rem;
}

/* Collapsible Summary */
.header-summary[b-qq2de4oebm] {
    border-top: 1px solid var(--rz-base-200);
    background: var(--rz-base-50);
}

.summary-toggle[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s;
}

.summary-toggle:hover[b-qq2de4oebm] {
    background: var(--rz-base-100);
}

.toggle-label[b-qq2de4oebm] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--rz-text-secondary-color);
}

.summary-preview[b-qq2de4oebm] {
    flex: 1;
    font-size: 0.85rem;
    color: var(--rz-text-tertiary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-left: 0.5rem;
}

.summary-full[b-qq2de4oebm] {
    margin: 0;
    padding: 0 1.5rem 1rem 2.5rem;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--rz-text-secondary-color);
}

/* Details Bar */
.header-details[b-qq2de4oebm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: var(--rz-base-100);
    border-top: 1px solid var(--rz-base-200);
}

.detail-chip[b-qq2de4oebm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    background: white;
    border-radius: 999px;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    border: 1px solid var(--rz-base-200);
}

.detail-chip[b-qq2de4oebm]  .rz-icon {
    font-size: 14px;
    color: var(--rz-primary);
}

.detail-chip.linkedin[b-qq2de4oebm] {
    background: #0A66C2;
    color: white;
    border-color: #0A66C2;
}

.detail-chip.linkedin[b-qq2de4oebm]  .rz-icon {
    color: white;
}

/* Two Column Layout */
.profile-layout[b-qq2de4oebm] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 1rem;
}

/* Left Sidebar */
.profile-sidebar-left[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.sidebar-section[b-qq2de4oebm] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.sidebar-section-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: var(--rz-base-50);
    border-bottom: 1px solid var(--rz-base-200);
}

.sidebar-section-header h3[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 0.85rem;
    font-weight: 600;
}

.sidebar-section-header[b-qq2de4oebm]  .rz-icon {
    font-size: 16px;
    color: var(--rz-primary);
}

/* Applications List */
.applications-list[b-qq2de4oebm] {
    padding: 0.5rem;
}

.app-card[b-qq2de4oebm] {
    padding: 0.75rem;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    border: 2px solid transparent;
    margin-bottom: 0.5rem;
}

.app-card:last-child[b-qq2de4oebm] {
    margin-bottom: 0;
}

.app-card:hover[b-qq2de4oebm] {
    background: var(--rz-base-50);
}

.app-card.active[b-qq2de4oebm] {
    background: var(--rz-primary-lighter);
    border-color: var(--rz-primary);
}

.app-card-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
}

.app-job-title[b-qq2de4oebm] {
    font-weight: 600;
    font-size: 0.85rem;
    line-height: 1.3;
}

.app-remove-btn[b-qq2de4oebm] {
    opacity: 0;
    transition: opacity 0.2s;
}

.app-card:hover .app-remove-btn[b-qq2de4oebm] {
    opacity: 1;
}

.app-card-meta[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.app-fit-score[b-qq2de4oebm] {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.125rem 0.375rem;
    border-radius: 999px;
}

.app-fit-score[b-qq2de4oebm]  .rz-icon {
    font-size: 10px;
}

.app-fit-score.excellent[b-qq2de4oebm] { background: #dcfce7; color: #166534; }
.app-fit-score.good[b-qq2de4oebm] { background: #dbeafe; color: #1e40af; }
.app-fit-score.fair[b-qq2de4oebm] { background: #fef3c7; color: #92400e; }
.app-fit-score.poor[b-qq2de4oebm] { background: #fee2e2; color: #991b1b; }

.sidebar-empty[b-qq2de4oebm] {
    padding: 1.5rem;
    text-align: center;
    color: var(--rz-text-disabled-color);
}

.sidebar-empty p[b-qq2de4oebm] {
    margin: 0 0 0.75rem;
    font-size: 0.85rem;
}

/* Documents List */
.documents-list[b-qq2de4oebm] {
    padding: 0.5rem;
}

.doc-item[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    border-radius: 6px;
    transition: background 0.2s;
}

.doc-item:hover[b-qq2de4oebm] {
    background: var(--rz-base-50);
}

.doc-icon-small[b-qq2de4oebm] {
    color: var(--rz-primary);
    font-size: 18px;
}

.doc-info[b-qq2de4oebm] {
    flex: 1;
    min-width: 0;
}

.doc-name-small[b-qq2de4oebm] {
    display: block;
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.doc-meta-small[b-qq2de4oebm] {
    font-size: 0.7rem;
    color: var(--rz-text-disabled-color);
}

.doc-actions-small[b-qq2de4oebm] {
    display: flex;
    gap: 0.125rem;
    opacity: 0;
    transition: opacity 0.2s;
}

.doc-item:hover .doc-actions-small[b-qq2de4oebm] {
    opacity: 1;
}

/* Compact Upload */
.upload-compact-label[b-qq2de4oebm] {
    display: block;
    cursor: pointer;
    position: relative;
    margin: 0.5rem;
}

.upload-compact-label input[type="file"][b-qq2de4oebm],
.upload-compact-label[b-qq2de4oebm]  input[type="file"],
.upload-compact-label[b-qq2de4oebm]  input {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
    z-index: 10;
}

.upload-compact[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem;
    border: 2px dashed var(--rz-base-300);
    border-radius: 8px;
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    transition: all 0.2s;
}

.upload-compact:hover[b-qq2de4oebm],
.upload-compact.dragging[b-qq2de4oebm] {
    border-color: var(--rz-primary);
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
}

.upload-compact[b-qq2de4oebm]  .rz-icon {
    font-size: 18px;
}

.upload-progress-small[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.8rem;
    color: var(--rz-info);
    background: var(--rz-info-lighter);
}

/* Context Bar */
.context-bar[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border-bottom: 1px solid var(--rz-base-200);
}

.context-bar.empty[b-qq2de4oebm] {
    justify-content: center;
    color: var(--rz-text-secondary-color);
    background: var(--rz-base-50);
}

.context-bar.empty[b-qq2de4oebm]  .rz-icon {
    font-size: 18px;
}

.context-info[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.context-job[b-qq2de4oebm] {
    font-weight: 600;
    font-size: 1rem;
}

.context-fit-score[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
}

.context-fit-score[b-qq2de4oebm]  .rz-icon {
    font-size: 16px;
}

.context-fit-score.excellent[b-qq2de4oebm] { background: #dcfce7; color: #166534; }
.context-fit-score.good[b-qq2de4oebm] { background: #dbeafe; color: #1e40af; }
.context-fit-score.fair[b-qq2de4oebm] { background: #fef3c7; color: #92400e; }
.context-fit-score.poor[b-qq2de4oebm] { background: #fee2e2; color: #991b1b; }

.score-bar[b-qq2de4oebm] {
    width: 60px;
    height: 6px;
    background: rgba(0,0,0,0.1);
    border-radius: 3px;
    overflow: hidden;
}

.score-fill[b-qq2de4oebm] {
    height: 100%;
    background: currentColor;
    border-radius: 3px;
}

.context-actions[b-qq2de4oebm] {
    display: flex;
    gap: 0.5rem;
}

.context-outcome[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
}

.context-outcome.hired[b-qq2de4oebm] {
    background: #dcfce7;
    color: #166534;
}

.context-outcome.rejected[b-qq2de4oebm] {
    background: #fee2e2;
    color: #991b1b;
}

.header-left[b-qq2de4oebm] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.back-btn[b-qq2de4oebm] {
    margin-top: 0.5rem;
}

.candidate-avatar[b-qq2de4oebm] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--rz-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1rem;
    flex-shrink: 0;
}

.candidate-avatar.large[b-qq2de4oebm] {
    width: 80px;
    height: 80px;
    font-size: 1.75rem;
}

.candidate-info h1[b-qq2de4oebm] {
    margin: 0;
    font-size: 1.5rem;
}

.candidate-info .title-company[b-qq2de4oebm] {
    margin: 0.25rem 0 0.5rem;
    color: var(--rz-text-secondary-color);
}

.contact-links[b-qq2de4oebm] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.contact-link[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
    text-decoration: none;
    transition: color 0.2s;
}

.contact-link:hover[b-qq2de4oebm] {
    color: var(--rz-primary);
}

.contact-link.linkedin[b-qq2de4oebm] {
    color: #0077B5;
}

.contact-link[b-qq2de4oebm]  .rz-icon {
    font-size: 16px;
}

/* LinkedIn Icon */
.linkedin-icon[b-qq2de4oebm] {
    width: 18px;
    height: 18px;
    object-fit: contain;
    vertical-align: middle;
}

.header-actions[b-qq2de4oebm] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Applications Nav */
.applications-nav[b-qq2de4oebm] {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding: 0.5rem;
    background: white;
    border-radius: 8px;
    margin-bottom: 1rem;
}

.app-nav-item[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: var(--rz-base-100);
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s;
    border: 2px solid transparent;
}

.app-nav-item:hover[b-qq2de4oebm] {
    background: var(--rz-base-200);
}

.app-nav-item.active[b-qq2de4oebm] {
    background: var(--rz-primary-lighter);
    border-color: var(--rz-primary);
}

.app-nav-item .job-title[b-qq2de4oebm] {
    font-weight: 500;
    font-size: 0.875rem;
}

.app-nav-item .app-delete-btn[b-qq2de4oebm] {
    opacity: 0;
    transition: opacity 0.2s;
    margin-left: auto;
}

.app-nav-item:hover .app-delete-btn[b-qq2de4oebm] {
    opacity: 1;
}

/* Main Content Layout */
.profile-content[b-qq2de4oebm] {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 1rem;
}

.profile-main[b-qq2de4oebm] {
    min-width: 0;
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.profile-sidebar[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Profile Tabs */
.profile-tabs[b-qq2de4oebm] {
    background: transparent;
    overflow: hidden;
}

[b-qq2de4oebm] .profile-tabs .rz-tabview-nav {
    background: white;
    border-bottom: 1px solid var(--rz-base-200);
    padding: 0 1rem;
}

[b-qq2de4oebm] .profile-tabs .rz-tabview-nav-link {
    padding: 0.75rem 1rem;
    font-weight: 500;
    font-size: 0.85rem;
}

[b-qq2de4oebm] .profile-tabs .rz-tabview-panel {
    padding: 0;
}

.tab-content[b-qq2de4oebm] {
    padding: 1.25rem;
}

/* Add Note Inline */
.add-note-inline[b-qq2de4oebm] {
    background: var(--rz-base-50);
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 1rem;
}

.add-note-inline .note-input[b-qq2de4oebm] {
    width: 100%;
    margin-bottom: 0.5rem;
}

.note-actions[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.private-label[b-qq2de4oebm] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    margin-right: auto;
}

/* Timeline */
.timeline[b-qq2de4oebm] {
    position: relative;
    padding-left: 2rem;
}

.timeline[b-qq2de4oebm]::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--rz-base-200);
}

.timeline-item[b-qq2de4oebm] {
    position: relative;
}

.timeline-item.private[b-qq2de4oebm] {
    opacity: 0.8;
}

.timeline-item.private .timeline-content[b-qq2de4oebm] {
    background: #fff8e1;
}

.timeline-marker[b-qq2de4oebm] {
    position: absolute;
    left: -2rem;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    z-index: 1;
}

.timeline-marker[b-qq2de4oebm]  .rz-icon {
    font-size: 16px;
}

.timeline-content[b-qq2de4oebm] {
    background: var(--rz-base-50);
    border-radius: 8px;
    padding: 0.75rem 1rem;
}

.timeline-header[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.timeline-title[b-qq2de4oebm] {
    font-weight: 600;
    font-size: 0.875rem;
}

.timeline-time[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-disabled-color);
    margin-left: auto;
}

.timeline-user[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    margin-left: 0.5rem;
}

.timeline-text[b-qq2de4oebm] {
    margin: 0.5rem 0 0;
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
}

.stage-change[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.stage-change[b-qq2de4oebm]  .rz-icon {
    font-size: 14px;
    color: var(--rz-text-secondary-color);
}

/* Pipeline Journey */
.pipeline-journey[b-qq2de4oebm] {
    padding: 1rem;
}

.journey-header[b-qq2de4oebm] {
    margin-bottom: 1.5rem;
}

.journey-header h3[b-qq2de4oebm] {
    margin: 0;
    font-size: 1.1rem;
}

.journey-header .applied-date[b-qq2de4oebm] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.journey-timeline[b-qq2de4oebm] {
    position: relative;
    padding-left: 1.5rem;
    margin-bottom: 1.5rem;
}

.journey-timeline[b-qq2de4oebm]::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--rz-base-300);
}

.journey-step[b-qq2de4oebm] {
    position: relative;
    padding-bottom: 1.5rem;
}

.journey-step:last-child[b-qq2de4oebm] {
    padding-bottom: 0;
}

.step-marker[b-qq2de4oebm] {
    position: absolute;
    left: -1.5rem;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    z-index: 1;
}

.step-content[b-qq2de4oebm] {
    padding-left: 0.5rem;
}

.step-header[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
}

.step-header[b-qq2de4oebm]  .rz-icon {
    font-size: 14px;
    color: var(--rz-text-disabled-color);
}

.from-stage[b-qq2de4oebm] {
    color: var(--rz-text-secondary-color);
}

.to-stage[b-qq2de4oebm] {
    font-weight: 600;
}

.step-meta[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.step-date[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-disabled-color);
}

.step-user[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.step-notes[b-qq2de4oebm] {
    margin: 0.25rem 0 0;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    font-style: italic;
}

.journey-outcome[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 8px;
}

.journey-outcome.hired[b-qq2de4oebm] {
    background: #dcfce7;
    color: #166534;
}

.journey-outcome.rejected[b-qq2de4oebm] {
    background: #fee2e2;
    color: #991b1b;
}

.journey-outcome[b-qq2de4oebm]  .rz-icon {
    font-size: 32px;
}

.journey-outcome strong[b-qq2de4oebm] {
    display: block;
    font-size: 1rem;
}

.journey-outcome span[b-qq2de4oebm] {
    font-size: 0.8rem;
}

.start-date[b-qq2de4oebm] {
    display: block;
    margin-top: 0.25rem;
}

/* Your Feedback Section */
.your-feedback-section[b-qq2de4oebm] {
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfdf5 100%);
    border: 1px solid #bbf7d0;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.feedback-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.feedback-header h4[b-qq2de4oebm] {
    margin: 0;
    font-size: 0.95rem;
    color: #166534;
}

.feedback-status[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    color: #16a34a;
}

.feedback-status[b-qq2de4oebm]  .rz-icon {
    font-size: 14px;
}

.vote-options-row[b-qq2de4oebm] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.vote-option-card[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border: 2px solid var(--rz-base-300);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    background: white;
    flex: 1;
    min-width: 100px;
    justify-content: center;
}

.vote-option-card:hover[b-qq2de4oebm] {
    border-color: var(--option-color, var(--rz-primary));
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.vote-option-card.selected[b-qq2de4oebm] {
    border-color: var(--option-color, var(--rz-primary));
    background: var(--option-color, var(--rz-primary));
    color: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.vote-option-card[b-qq2de4oebm]  .rz-icon {
    font-size: 18px;
}

.vote-option-card span[b-qq2de4oebm] {
    font-size: 0.8rem;
    font-weight: 600;
}

.feedback-comment[b-qq2de4oebm] {
    margin-bottom: 1rem;
}

.feedback-comment[b-qq2de4oebm]  .rz-textarea {
    background: white;
    border-color: #d1fae5;
}

.feedback-comment[b-qq2de4oebm]  .rz-textarea:focus {
    border-color: #22c55e;
}

.feedback-actions[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
}

.unsaved-indicator[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    color: #f59e0b;
}

.unsaved-indicator[b-qq2de4oebm]  .rz-icon {
    font-size: 14px;
}

/* Team Feedback Section */
.team-feedback-section[b-qq2de4oebm] {
    margin-top: 1rem;
}

.team-feedback-section h4[b-qq2de4oebm] {
    margin: 0 0 1rem;
    font-size: 0.95rem;
    color: var(--rz-text-secondary-color);
}

/* Votes List */
.votes-list[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.vote-summary-bar[b-qq2de4oebm] {
    display: flex;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.bar-segment.yes[b-qq2de4oebm] {
    background: #22c55e;
}

.bar-segment.no[b-qq2de4oebm] {
    background: #ef4444;
}

.vote-legend[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    margin-bottom: 1rem;
}

.vote-legend .yes[b-qq2de4oebm] {
    color: #22c55e;
}

.vote-legend .no[b-qq2de4oebm] {
    color: #ef4444;
}

.vote-item[b-qq2de4oebm] {
    display: flex;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--rz-base-50);
    border-radius: 8px;
}

.vote-item.current-user[b-qq2de4oebm] {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid #93c5fd;
}

.you-badge[b-qq2de4oebm] {
    font-size: 0.7rem;
    color: #3b82f6;
    font-weight: 400;
}

.voter-avatar[b-qq2de4oebm] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
    flex-shrink: 0;
}

.voter-avatar-img[b-qq2de4oebm] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.vote-details[b-qq2de4oebm] {
    flex: 1;
    min-width: 0;
}

.vote-header[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.voter-name[b-qq2de4oebm] {
    font-weight: 500;
    font-size: 0.875rem;
}

.vote-time[b-qq2de4oebm] {
    font-size: 0.7rem;
    color: var(--rz-text-disabled-color);
    margin-left: auto;
}

.vote-comment-text[b-qq2de4oebm] {
    margin: 0.25rem 0 0;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

/* Upload Area - Label wrapper pattern (hides native file input) */
.upload-label[b-qq2de4oebm] {
    display: flex;
    width: 100%;
    cursor: pointer;
    position: relative;
    margin-bottom: 1rem;
}

.upload-label input[type="file"][b-qq2de4oebm],
.upload-label[b-qq2de4oebm]  input[type="file"],
.upload-label[b-qq2de4oebm]  input {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
    z-index: 10;
}

/* Hide any visible file input text/button */
.upload-label[b-qq2de4oebm]  input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
}

.upload-label[b-qq2de4oebm]  input[type="file"]::file-selector-button {
    visibility: hidden;
}

.upload-area[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem;
    border: 2px dashed var(--rz-base-300);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    color: var(--rz-text-secondary-color);
    width: 100%;
}

.upload-label:hover .upload-area[b-qq2de4oebm],
.upload-area.dragging[b-qq2de4oebm] {
    border-color: var(--rz-primary);
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
}

.upload-area[b-qq2de4oebm]  .rz-icon {
    font-size: 32px;
}

.upload-hint[b-qq2de4oebm] {
    font-size: 0.75rem;
    opacity: 0.7;
}

/* Compact add document button when documents exist */
.add-document-label[b-qq2de4oebm] {
    position: relative;
    display: inline-flex;
    margin-top: 1rem;
    cursor: pointer;
}

.add-document-label input[type="file"][b-qq2de4oebm],
.add-document-label[b-qq2de4oebm]  input[type="file"],
.add-document-label[b-qq2de4oebm]  input {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
    z-index: 10;
}

.add-document-label[b-qq2de4oebm]  input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
}

.add-document-label[b-qq2de4oebm]  input[type="file"]::file-selector-button {
    visibility: hidden;
}

.upload-progress[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: var(--rz-info-lighter);
    border-radius: 6px;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    color: var(--rz-info);
}

/* Documents Grid */
.documents-grid[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.document-card[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--rz-base-50);
    border-radius: 8px;
    transition: background 0.2s;
}

.document-card:hover[b-qq2de4oebm] {
    background: var(--rz-base-100);
}

.doc-icon[b-qq2de4oebm] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.doc-icon[b-qq2de4oebm]  .rz-icon {
    font-size: 20px;
}

.doc-details[b-qq2de4oebm] {
    flex: 1;
    min-width: 0;
}

.doc-name[b-qq2de4oebm] {
    display: block;
    font-weight: 500;
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.doc-meta[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.doc-date[b-qq2de4oebm] {
    display: block;
    font-size: 0.7rem;
    color: var(--rz-text-disabled-color);
}

.doc-actions[b-qq2de4oebm] {
    display: flex;
    gap: 0.25rem;
}

/* Empty States */
.empty-tab[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: var(--rz-text-disabled-color);
}

.empty-tab.small[b-qq2de4oebm] {
    padding: 2rem;
}

.empty-tab[b-qq2de4oebm]  .rz-icon {
    font-size: 48px;
    margin-bottom: 0.5rem;
}

.empty-tab p[b-qq2de4oebm] {
    margin: 0;
}

/* Section Cards */
.section-card[b-qq2de4oebm] {
    background: white;
    border-radius: 12px;
    padding: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.section-card h3[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem;
    font-size: 0.9rem;
    font-weight: 600;
}

.section-card h3[b-qq2de4oebm]  .rz-icon {
    font-size: 18px;
    color: var(--rz-primary);
}

.detail-list[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-item[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.detail-item .label[b-qq2de4oebm] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.detail-item .value[b-qq2de4oebm] {
    font-size: 0.875rem;
    font-weight: 500;
    text-align: right;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.source-badge[b-qq2de4oebm] {
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
}

.summary-text[b-qq2de4oebm] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--rz-text-secondary-color);
}

/* Quick Actions */
.actions-card[b-qq2de4oebm] {
    border: 2px solid var(--rz-primary-lighter);
}

.quick-actions[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.action-btn[b-qq2de4oebm] {
    width: 100%;
    justify-content: flex-start;
}

/* AI Analysis Tab Styles */
.ai-analysis-content[b-qq2de4oebm] {
    max-width: 600px;
}

.ai-score-header[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.ai-score-circle[b-qq2de4oebm] {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 4px solid;
}

.ai-score-circle .score-number[b-qq2de4oebm] {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.ai-score-circle .score-percent[b-qq2de4oebm] {
    font-size: 0.9rem;
    font-weight: 600;
}

.ai-score-circle.excellent[b-qq2de4oebm] { background: #dcfce7; border-color: #16a34a; color: #166534; }
.ai-score-circle.good[b-qq2de4oebm] { background: #dbeafe; border-color: #2563eb; color: #1e40af; }
.ai-score-circle.fair[b-qq2de4oebm] { background: #fef3c7; border-color: #d97706; color: #92400e; }
.ai-score-circle.poor[b-qq2de4oebm] { background: #fee2e2; border-color: #dc2626; color: #991b1b; }

.ai-score-info h4[b-qq2de4oebm] {
    margin: 0 0 0.25rem;
    font-size: 1.1rem;
}

.ai-score-info p[b-qq2de4oebm] {
    margin: 0;
    color: var(--rz-text-secondary-color);
    font-size: 0.9rem;
}

.ai-score-info .scored-at[b-qq2de4oebm] {
    display: block;
    font-size: 0.75rem;
    color: var(--rz-text-disabled-color);
    margin-top: 0.5rem;
}

.ai-score-actions[b-qq2de4oebm] {
    margin-left: auto;
}

.ai-score-actions[b-qq2de4oebm]  .rz-button {
    font-size: 0.8rem;
}

.ai-reasoning-card[b-qq2de4oebm],
.ai-criteria-card[b-qq2de4oebm] {
    background: var(--rz-base-50);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
}

.ai-reasoning-card h5[b-qq2de4oebm],
.ai-criteria-card h5[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0.75rem;
    font-size: 0.9rem;
    color: var(--rz-primary);
}

.ai-reasoning-card h5[b-qq2de4oebm]  .rz-icon,
.ai-criteria-card h5[b-qq2de4oebm]  .rz-icon {
    font-size: 18px;
}

.ai-reasoning-card p[b-qq2de4oebm] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--rz-text-secondary-color);
}

.criteria-list[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.criterion-item[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.criterion-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.criterion-name[b-qq2de4oebm] {
    font-size: 0.85rem;
    font-weight: 500;
}

.criterion-score[b-qq2de4oebm] {
    font-size: 0.85rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

.criterion-score.excellent[b-qq2de4oebm] { background: #dcfce7; color: #166534; }
.criterion-score.good[b-qq2de4oebm] { background: #dbeafe; color: #1e40af; }
.criterion-score.fair[b-qq2de4oebm] { background: #fef3c7; color: #92400e; }
.criterion-score.poor[b-qq2de4oebm] { background: #fee2e2; color: #991b1b; }

.criterion-progress[b-qq2de4oebm] {
    height: 8px;
    background: var(--rz-base-200);
    border-radius: 4px;
    overflow: hidden;
}

.criterion-bar-fill[b-qq2de4oebm] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.criterion-bar-fill.excellent[b-qq2de4oebm] { background: #16a34a; }
.criterion-bar-fill.good[b-qq2de4oebm] { background: #2563eb; }
.criterion-bar-fill.fair[b-qq2de4oebm] { background: #d97706; }
.criterion-bar-fill.poor[b-qq2de4oebm] { background: #dc2626; }

.ai-model-info[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--rz-text-disabled-color);
}

.ai-model-info[b-qq2de4oebm]  .rz-icon {
    font-size: 14px;
}

/* Responsive */
@media (max-width: 1024px) {
    .profile-layout[b-qq2de4oebm] {
        grid-template-columns: 1fr;
    }

    .profile-sidebar-left[b-qq2de4oebm] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
}

@media (max-width: 768px) {
    .candidate-profile[b-qq2de4oebm] {
        padding: 0.75rem;
    }

    .profile-header[b-qq2de4oebm] {
        padding: 1rem;
    }

    .header-left[b-qq2de4oebm] {
        flex-direction: column;
    }

    .back-btn[b-qq2de4oebm] {
        order: -1;
        align-self: flex-start;
    }

    .candidate-avatar.large[b-qq2de4oebm] {
        width: 64px;
        height: 64px;
        font-size: 1.5rem;
    }

    .candidate-info h1[b-qq2de4oebm] {
        font-size: 1.25rem;
    }

    .header-actions[b-qq2de4oebm] {
        width: 100%;
    }

    .header-actions[b-qq2de4oebm]  .rz-button {
        flex: 1;
    }

    .contact-links[b-qq2de4oebm] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .header-details[b-qq2de4oebm] {
        flex-wrap: wrap;
        padding: 0.5rem 1rem;
    }

    .profile-sidebar-left[b-qq2de4oebm] {
        grid-template-columns: 1fr;
    }

    .context-bar[b-qq2de4oebm] {
        flex-direction: column;
        align-items: stretch;
    }

    .context-actions[b-qq2de4oebm] {
        flex-wrap: wrap;
    }

    .vote-options-grid[b-qq2de4oebm] {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Fix tabs on mobile */
    [b-qq2de4oebm] .profile-tabs .rz-tabview-nav {
        padding: 0;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    [b-qq2de4oebm] .profile-tabs .rz-tabview-nav-link {
        padding: 0.75rem 0.75rem;
        font-size: 0.8rem;
        white-space: nowrap;
    }

    .tab-content[b-qq2de4oebm] {
        padding: 0.75rem;
    }

    .profile-main[b-qq2de4oebm] {
        min-width: 0;
        overflow: hidden;
        background: white;
        border-radius: 12px;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .ai-score-header[b-qq2de4oebm] {
        flex-direction: column;
        text-align: center;
    }

    .ai-score-circle[b-qq2de4oebm] {
        width: 80px;
        height: 80px;
    }

    .ai-score-circle .score-number[b-qq2de4oebm] {
        font-size: 1.5rem;
    }
}

/* AI Fit Score Badge (nav item) */
.fit-score-badge[b-qq2de4oebm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
}

.fit-score-badge[b-qq2de4oebm]  .rz-icon {
    font-size: 12px;
}

.fit-score-badge.excellent[b-qq2de4oebm] {
    background: #dcfce7;
    color: #166534;
}

.fit-score-badge.good[b-qq2de4oebm] {
    background: #dbeafe;
    color: #1e40af;
}

.fit-score-badge.fair[b-qq2de4oebm] {
    background: #fef3c7;
    color: #92400e;
}

.fit-score-badge.poor[b-qq2de4oebm] {
    background: #fee2e2;
    color: #991b1b;
}

/* AI Fit Score Card */
.fit-score-card[b-qq2de4oebm] {
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 50%, #e9d5ff 100%);
    border: 1px solid #c4b5fd;
}

.fit-score-card h3[b-qq2de4oebm] {
    color: #6d28d9;
}

.fit-score-card h3[b-qq2de4oebm]  .rz-icon {
    color: #8b5cf6;
}

.fit-score-display[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    margin: 0.5rem 0;
    border-radius: 12px;
    background: white;
}

.fit-score-display .score-value[b-qq2de4oebm] {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1;
}

.fit-score-display .score-label[b-qq2de4oebm] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.25rem;
}

.fit-score-display.excellent .score-value[b-qq2de4oebm] { color: #16a34a; }
.fit-score-display.good .score-value[b-qq2de4oebm] { color: #2563eb; }
.fit-score-display.fair .score-value[b-qq2de4oebm] { color: #d97706; }
.fit-score-display.poor .score-value[b-qq2de4oebm] { color: #dc2626; }

.fit-score-display.excellent[b-qq2de4oebm] { border: 2px solid #16a34a; }
.fit-score-display.good[b-qq2de4oebm] { border: 2px solid #2563eb; }
.fit-score-display.fair[b-qq2de4oebm] { border: 2px solid #d97706; }
.fit-score-display.poor[b-qq2de4oebm] { border: 2px solid #dc2626; }

.fit-reasoning[b-qq2de4oebm] {
    font-size: 0.85rem;
    color: #4c1d95;
    line-height: 1.5;
    margin: 0.75rem 0;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 8px;
}

.fit-criteria[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.criterion-row[b-qq2de4oebm] {
    display: grid;
    grid-template-columns: 80px 1fr 40px;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
}

.criterion-label[b-qq2de4oebm] {
    color: #5b21b6;
    font-weight: 500;
}

.criterion-bar[b-qq2de4oebm] {
    height: 8px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    overflow: hidden;
}

.criterion-fill[b-qq2de4oebm] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.criterion-fill.excellent[b-qq2de4oebm] { background: #16a34a; }
.criterion-fill.good[b-qq2de4oebm] { background: #2563eb; }
.criterion-fill.fair[b-qq2de4oebm] { background: #d97706; }
.criterion-fill.poor[b-qq2de4oebm] { background: #dc2626; }

.criterion-value[b-qq2de4oebm] {
    text-align: right;
    font-weight: 600;
    color: #4c1d95;
}

.scored-date[b-qq2de4oebm] {
    display: block;
    font-size: 0.7rem;
    color: #7c3aed;
    text-align: right;
    margin-top: 0.5rem;
}

/* AI Scoring Loading State */
.app-fit-score.scoring[b-qq2de4oebm] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.7rem;
    font-weight: 500;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
    color: #7c3aed;
    animation: pulse-glow-b-qq2de4oebm 2s ease-in-out infinite;
}

@keyframes pulse-glow-b-qq2de4oebm {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.2);
    }
    50% {
        box-shadow: 0 0 8px 2px rgba(124, 58, 237, 0.3);
    }
}

.ai-scoring-loading[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 50%, #ede9fe 100%);
    border-radius: 16px;
    border: 1px solid #e9d5ff;
}

.scoring-animation[b-qq2de4oebm] {
    margin-bottom: 1.5rem;
}

.scoring-animation[b-qq2de4oebm]  .rz-progressbar-circular {
    color: #8b5cf6;
}

.ai-scoring-loading h4[b-qq2de4oebm] {
    margin: 0 0 0.5rem;
    font-size: 1.1rem;
    color: #6d28d9;
}

.ai-scoring-loading p[b-qq2de4oebm] {
    margin: 0 0 1.5rem;
    font-size: 0.9rem;
    color: #7c3aed;
    max-width: 320px;
}

.scoring-steps[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: 100%;
    max-width: 280px;
}

.scoring-step[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 8px;
    font-size: 0.85rem;
    color: #a78bfa;
    transition: all 0.3s ease;
}

.scoring-step[b-qq2de4oebm]  .rz-icon {
    font-size: 18px;
}

.scoring-step.active[b-qq2de4oebm] {
    background: white;
    color: #7c3aed;
    box-shadow: 0 2px 8px rgba(124, 58, 237, 0.15);
}

.scoring-step.active[b-qq2de4oebm]  .rz-icon {
    color: #8b5cf6;
}

.scoring-step.completed[b-qq2de4oebm] {
    background: #dcfce7;
    color: #166534;
}

.scoring-step.completed[b-qq2de4oebm]  .rz-icon {
    color: #16a34a;
}

/* ===================== */
/* Email Tab Styles      */
/* ===================== */

.emails-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.emails-header h4[b-qq2de4oebm] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.emails-header-left[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.sync-info[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-tertiary-color);
}

.emails-header-actions[b-qq2de4oebm] {
    display: flex;
    gap: 0.5rem;
}

.emails-syncing[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem;
    color: var(--rz-text-secondary-color);
}

.email-threads[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.email-thread[b-qq2de4oebm] {
    border: 1px solid var(--rz-base-200);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s;
}

.email-thread:hover[b-qq2de4oebm] {
    border-color: var(--rz-primary);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.email-thread.expanded[b-qq2de4oebm] {
    border-color: var(--rz-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.thread-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: var(--rz-base-50);
}

.thread-subject[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}

.subject-text[b-qq2de4oebm] {
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.thread-meta[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--rz-text-tertiary-color);
}

.thread-messages[b-qq2de4oebm] {
    border-top: 1px solid var(--rz-base-200);
}

.email-message[b-qq2de4oebm] {
    padding: 1rem;
    border-bottom: 1px solid var(--rz-base-100);
}

.email-message:last-child[b-qq2de4oebm] {
    border-bottom: none;
}

.email-message.inbound[b-qq2de4oebm] {
    background: white;
}

.email-message.outbound[b-qq2de4oebm] {
    background: #f0f7ff;
}

.message-header[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.message-from[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.message-from[b-qq2de4oebm]  .rz-icon {
    font-size: 16px;
    color: var(--rz-text-tertiary-color);
}

.email-message.outbound .message-from[b-qq2de4oebm]  .rz-icon {
    color: var(--rz-primary);
}

.from-name[b-qq2de4oebm] {
    font-weight: 500;
    font-size: 0.875rem;
}

.from-email[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-tertiary-color);
}

.message-date[b-qq2de4oebm] {
    font-size: 0.75rem;
    color: var(--rz-text-tertiary-color);
}

.message-body[b-qq2de4oebm] {
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--rz-text-color);
    max-height: 300px;
    overflow-y: auto;
}

.message-body p[b-qq2de4oebm] {
    margin: 0 0 0.5rem 0;
}

.message-body img[b-qq2de4oebm] {
    max-width: 100%;
    height: auto;
}

.message-actions[b-qq2de4oebm] {
    margin-top: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--rz-base-100);
}

/* ===================== */
/* Resume Tab Styles     */
/* ===================== */

.resume-tab[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 400px);
    min-height: 500px;
}

.resume-loading[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 1rem;
    flex: 1;
}

.resume-toolbar[b-qq2de4oebm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: var(--rz-base-100);
    border: 1px solid var(--rz-base-200);
    border-radius: 8px 8px 0 0;
    flex-shrink: 0;
}

.resume-info[b-qq2de4oebm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--rz-text-secondary-color);
}

.resume-info[b-qq2de4oebm]  .rz-icon {
    color: var(--rz-primary);
    font-size: 20px;
}

.resume-actions[b-qq2de4oebm] {
    display: flex;
    gap: 0.5rem;
}

.resume-viewer[b-qq2de4oebm] {
    flex: 1;
    width: 100%;
    border: 1px solid var(--rz-base-200);
    border-top: none;
    border-radius: 0 0 8px 8px;
    background: white;
    min-height: 500px;
}

.upload-resume-label[b-qq2de4oebm] {
    cursor: pointer;
}

.upload-resume-label input[type="file"][b-qq2de4oebm] {
    display: none;
}

.upload-resume-label[b-qq2de4oebm]  .rz-button {
    pointer-events: none;
}

.word-doc-message[b-qq2de4oebm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    background: var(--rz-base-50);
    border: 1px solid var(--rz-base-200);
    border-top: none;
    border-radius: 0 0 8px 8px;
    flex: 1;
    min-height: 300px;
}

.word-doc-message[b-qq2de4oebm]  .rz-icon {
    font-size: 48px;
    color: #2563eb;
    margin-bottom: 1rem;
}

.word-doc-message h4[b-qq2de4oebm] {
    margin: 0 0 0.5rem;
    font-size: 1.1rem;
    color: var(--rz-text-color);
}

.word-doc-message p[b-qq2de4oebm] {
    margin: 0 0 1.5rem;
    color: var(--rz-text-secondary-color);
    max-width: 400px;
}

.word-doc-actions[b-qq2de4oebm] {
    display: flex;
    gap: 0.75rem;
}

/* Word Document Preview Container */
.word-doc-preview-container[b-qq2de4oebm] {
    flex: 1;
    width: 100%;
    border: 1px solid var(--rz-base-200);
    border-top: none;
    border-radius: 0 0 8px 8px;
    background: white;
    min-height: 500px;
    max-height: calc(100vh - 300px);
    overflow: auto;
    padding: 1rem;
}

/* Style the docx-preview wrapper */
.word-doc-preview-container[b-qq2de4oebm]  .docx-wrapper {
    background: white !important;
    padding: 0 !important;
}

/* Style the document pages */
.word-doc-preview-container[b-qq2de4oebm]  .docx-wrapper > section.docx {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin: 0 auto 1rem;
    padding: 1in;
    background: white;
    width: auto !important;
    max-width: 100%;
    min-width: auto !important;
}

/* Make content responsive */
.word-doc-preview-container[b-qq2de4oebm]  .docx-wrapper > section.docx > * {
    max-width: 100%;
    word-wrap: break-word;
}

/* Style images to be responsive */
.word-doc-preview-container[b-qq2de4oebm]  img {
    max-width: 100%;
    height: auto;
}

/* Style tables to be responsive */
.word-doc-preview-container[b-qq2de4oebm]  table {
    max-width: 100%;
    overflow-x: auto;
    display: block;
}
/* /Components/Pages/Talent/Candidates.razor.rz.scp.css */
/* Candidates Page Styles */
.talent-page[b-bjq5fx089n] {
    max-width: 1400px;
    margin: 0 auto;
    background: var(--rz-base-100);
    height: calc(100dvh - 110px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.page-header[b-bjq5fx089n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: white;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    flex-shrink: 0;
}

.header-title-row[b-bjq5fx089n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-left h1[b-bjq5fx089n] {
    font-size: 1.75rem;
    margin: 0;
    color: var(--rz-text-color);
}

.header-subtitle[b-bjq5fx089n] {
    margin: 0.25rem 0 0;
    color: var(--rz-text-secondary-color);
    font-size: 0.9rem;
}

.add-btn[b-bjq5fx089n] {
    padding: 0.75rem 1.5rem !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
}

.help-panel[b-bjq5fx089n] {
    flex-shrink: 0;
}

.filters-row[b-bjq5fx089n] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: var(--rz-base-100);
    border-radius: 8px;
    flex-shrink: 0;
}

.filter-active-btn[b-bjq5fx089n] {
    background: var(--rz-primary-lighter) !important;
    color: var(--rz-primary) !important;
}

.filter-badge[b-bjq5fx089n] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}

.filter-badge[b-bjq5fx089n]  .rz-icon {
    font-size: 1rem;
}

/* Advanced Filters Panel */
.advanced-filters-panel[b-bjq5fx089n] {
    background: white;
    border-radius: 8px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    animation: slideDown-b-bjq5fx089n 0.2s ease-out;
    flex-shrink: 0;
}

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

.filters-grid[b-bjq5fx089n] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.filter-item[b-bjq5fx089n] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.filter-item label[b-bjq5fx089n] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rz-text-secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filters-actions[b-bjq5fx089n] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    padding-top: 0.75rem;
    border-top: 1px solid var(--rz-base-100);
}

.loading-container[b-bjq5fx089n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 1rem;
}

.empty-state[b-bjq5fx089n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: var(--rz-base-100);
    border-radius: 12px;
    gap: 0.5rem;
}

.empty-state h3[b-bjq5fx089n] {
    margin: 0.5rem 0 0;
}

.empty-state p[b-bjq5fx089n] {
    margin: 0.25rem 0 1rem;
    color: var(--rz-text-secondary-color);
}

/* Desktop view fills remaining space */
.desktop-view[b-bjq5fx089n] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* Grid Styles */
[b-bjq5fx089n] .talent-grid {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Allow all columns to wrap text */
[b-bjq5fx089n] .talent-grid .rz-cell-data {
    white-space: normal !important;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.3;
}

.candidate-cell[b-bjq5fx089n] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.candidate-avatar[b-bjq5fx089n] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--rz-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.candidate-avatar.large[b-bjq5fx089n] {
    width: 48px;
    height: 48px;
    font-size: 1rem;
}

.candidate-info[b-bjq5fx089n] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.candidate-name[b-bjq5fx089n] {
    color: var(--rz-primary);
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.candidate-name:hover[b-bjq5fx089n] {
    text-decoration: underline;
}

.candidate-email[b-bjq5fx089n] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.latest-app[b-bjq5fx089n] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.latest-app .job-title[b-bjq5fx089n] {
    font-size: 0.8rem;
    font-weight: 500;
}

.no-app[b-bjq5fx089n] {
    color: var(--rz-text-disabled-color);
    font-style: italic;
    font-size: 0.8rem;
}

.count-badge[b-bjq5fx089n] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    padding: 0.2rem 0.5rem;
    background: var(--rz-primary);
    color: white;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
}

.count-badge.muted[b-bjq5fx089n] {
    background: var(--rz-base-400);
}

/* Mobile Cards */
.mobile-view[b-bjq5fx089n] {
    display: none;
}

.candidate-card[b-bjq5fx089n] {
    background: white;
    border-radius: 12px;
    padding: 1rem;
    margin-bottom: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.candidate-card:hover[b-bjq5fx089n] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.candidate-card-header[b-bjq5fx089n] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.candidate-card-info[b-bjq5fx089n] {
    flex: 1;
    min-width: 0;
}

.candidate-card-info h3[b-bjq5fx089n] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.candidate-card-info .candidate-email[b-bjq5fx089n] {
    margin: 0.125rem 0;
}

.candidate-card-info .candidate-role[b-bjq5fx089n] {
    margin: 0;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.candidate-card-app[b-bjq5fx089n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    font-size: 0.8rem;
}

.candidate-card-app .label[b-bjq5fx089n] {
    color: var(--rz-text-secondary-color);
}

.candidate-card-app .job[b-bjq5fx089n] {
    font-weight: 500;
    flex: 1;
}

.candidate-card-footer[b-bjq5fx089n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0.5rem;
    border-top: 1px solid var(--rz-base-200);
}

.candidate-card-footer .source[b-bjq5fx089n] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.candidate-card-footer .actions[b-bjq5fx089n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* LinkedIn Icon */
.linkedin-link[b-bjq5fx089n] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s;
}

.linkedin-link:hover[b-bjq5fx089n] {
    opacity: 0.8;
}

.linkedin-icon[b-bjq5fx089n] {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.linkedin-icon.small[b-bjq5fx089n] {
    width: 20px;
    height: 20px;
}

/* Help Panel Styles (desktop) */
.help-panel[b-bjq5fx089n] {
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfeff 100%);
    border: 1px solid #86efac;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}

.help-panel-header[b-bjq5fx089n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.help-panel-header[b-bjq5fx089n]  .rz-icon {
    color: var(--rz-primary);
}

.help-panel-header strong[b-bjq5fx089n] {
    flex: 1;
    color: var(--rz-text-color);
}

.help-close-btn[b-bjq5fx089n] {
    margin-left: auto;
}

.help-panel p[b-bjq5fx089n] {
    margin: 0 0 0.5rem;
    color: var(--rz-text-secondary-color);
    font-size: 0.9rem;
}

.help-panel ul[b-bjq5fx089n] {
    margin: 0;
    padding-left: 1.25rem;
}

.help-panel li[b-bjq5fx089n] {
    margin-bottom: 0.25rem;
    font-size: 0.85rem;
    color: var(--rz-text-secondary-color);
}

/* Mobile-only helper class */
.mobile-only[b-bjq5fx089n] {
    display: none;
}

/* Filters header (hidden on desktop) */
.filters-header[b-bjq5fx089n] {
    display: none;
}

/* ========================================================================= */
/* RESPONSIVE - MOBILE & PWA                                                 */
/* ========================================================================= */

@media (max-width: 768px) {
    .talent-page[b-bjq5fx089n] {
        padding: 0;
        height: 100vh;
        height: 100dvh;
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    /* Sticky header */
    .page-header[b-bjq5fx089n] {
        position: sticky;
        top: 0;
        z-index: 100;
        flex-direction: column;
        align-items: stretch;
        padding: 0.875rem 1rem;
        margin-bottom: 0;
        border-radius: 0;
        background: white;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    .header-title-row[b-bjq5fx089n] {
        justify-content: space-between;
    }

    .header-left h1[b-bjq5fx089n] {
        font-size: 1.35rem;
    }

    .header-subtitle[b-bjq5fx089n] {
        display: none;
    }

    /* Hide help button on mobile */
    .info-btn[b-bjq5fx089n] {
        display: none;
    }

    .header-actions[b-bjq5fx089n] {
        margin-top: 0.75rem;
    }

    .add-btn[b-bjq5fx089n] {
        width: 100%;
        min-height: 44px !important;
    }

    /* Filters row */
    .filters-row[b-bjq5fx089n] {
        padding: 0.75rem 1rem;
        margin-bottom: 0;
        background: white;
        border-radius: 0;
        border-bottom: 1px solid var(--rz-base-200);
    }

    .filters-row[b-bjq5fx089n]  .rz-stack {
        flex-direction: column;
        align-items: stretch !important;
        gap: 0.5rem !important;
    }

    .filters-row[b-bjq5fx089n]  .rz-dropdown,
    .filters-row[b-bjq5fx089n]  .rz-textbox {
        width: 100% !important;
        min-width: unset !important;
        min-height: 44px;
    }

    .filter-badge[b-bjq5fx089n] {
        align-self: flex-start;
    }

    /* Full-screen filters panel on mobile */
    .mobile-only[b-bjq5fx089n] {
        display: block;
    }

    .filters-header[b-bjq5fx089n] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1rem;
        border-bottom: 1px solid var(--rz-base-200);
        background: white;
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .filters-header h3[b-bjq5fx089n] {
        margin: 0;
        font-size: 1.1rem;
        font-weight: 600;
    }

    .advanced-filters-panel[b-bjq5fx089n] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 200;
        padding: 0;
        margin: 0;
        border-radius: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        display: flex;
        flex-direction: column;
        animation: slideUp-b-bjq5fx089n 0.25s ease-out;
    }

    @keyframes slideUp-b-bjq5fx089n {
        from { transform: translateY(100%); }
        to { transform: translateY(0); }
    }

    .filters-grid[b-bjq5fx089n] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
        padding: 1rem;
        flex: 1;
        margin-bottom: 0;
    }

    .filter-item[b-bjq5fx089n] {
        gap: 0.5rem;
    }

    .filter-item label[b-bjq5fx089n] {
        font-size: 0.8rem;
    }

    .filter-item[b-bjq5fx089n]  .rz-dropdown,
    .filter-item[b-bjq5fx089n]  .rz-datepicker,
    .filter-item[b-bjq5fx089n]  .rz-textbox {
        width: 100% !important;
        min-height: 44px;
    }

    .filters-actions[b-bjq5fx089n] {
        position: sticky;
        bottom: 0;
        flex-direction: row;
        background: white;
        padding: 1rem;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0));
        border-top: 1px solid var(--rz-base-200);
        box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
        gap: 0.5rem;
    }

    .filters-actions[b-bjq5fx089n]  .rz-button {
        flex: 1;
        min-height: 44px;
    }

    /* Desktop view hidden */
    .desktop-view[b-bjq5fx089n] {
        display: none;
    }

    /* Mobile view */
    .mobile-view[b-bjq5fx089n] {
        display: block;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0.75rem;
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0));
    }

    /* ===== MOBILE CANDIDATE CARDS ===== */
    .candidate-card[b-bjq5fx089n] {
        padding: 1rem;
        border-radius: 12px;
        margin-bottom: 0.625rem;
        border-left: 4px solid var(--rz-primary);
        -webkit-tap-highlight-color: rgba(0, 79, 60, 0.1);
    }

    .candidate-card:hover[b-bjq5fx089n] {
        transform: none;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .candidate-card:active[b-bjq5fx089n] {
        transform: scale(0.98);
        background: var(--rz-base-50);
    }

    .candidate-card-header[b-bjq5fx089n] {
        gap: 0.625rem;
        margin-bottom: 0.625rem;
    }

    .candidate-avatar.large[b-bjq5fx089n] {
        width: 44px;
        height: 44px;
        font-size: 0.9rem;
    }

    .candidate-card-info h3[b-bjq5fx089n] {
        font-size: 0.95rem;
        line-height: 1.3;
    }

    .candidate-card-info .candidate-email[b-bjq5fx089n] {
        font-size: 0.75rem;
    }

    .candidate-card-info .candidate-role[b-bjq5fx089n] {
        font-size: 0.75rem;
        line-height: 1.3;
    }

    .candidate-card-app[b-bjq5fx089n] {
        flex-wrap: wrap;
        padding: 0.625rem 0;
        font-size: 0.75rem;
        gap: 0.375rem;
    }

    .candidate-card-footer[b-bjq5fx089n] {
        padding-top: 0.625rem;
        gap: 0.5rem;
    }

    .candidate-card-footer .source[b-bjq5fx089n] {
        font-size: 0.7rem;
    }

    .candidate-card-footer .actions[b-bjq5fx089n] {
        gap: 0.375rem;
    }

    .candidate-card-footer .actions[b-bjq5fx089n]  .rz-button {
        min-width: 36px;
        min-height: 36px;
    }

    .linkedin-icon.small[b-bjq5fx089n] {
        width: 18px;
        height: 18px;
    }

    /* Loading & Empty states */
    .loading-container[b-bjq5fx089n] {
        padding: 3rem 1.5rem;
    }

    .empty-state[b-bjq5fx089n] {
        padding: 3rem 1.5rem;
        margin: 0.75rem;
        border-radius: 12px;
    }
}

/* Extra small screens (iPhone SE, etc.) */
@media (max-width: 375px) {
    .page-header[b-bjq5fx089n] {
        padding: 0.75rem;
    }

    .header-left h1[b-bjq5fx089n] {
        font-size: 1.2rem;
    }

    .filters-row[b-bjq5fx089n] {
        padding: 0.625rem 0.75rem;
    }

    .mobile-view[b-bjq5fx089n] {
        padding: 0.5rem;
    }

    .candidate-card[b-bjq5fx089n] {
        padding: 0.875rem;
    }

    .candidate-avatar.large[b-bjq5fx089n] {
        width: 40px;
        height: 40px;
        font-size: 0.85rem;
    }

    .candidate-card-info h3[b-bjq5fx089n] {
        font-size: 0.9rem;
    }
}
/* /Components/Pages/Talent/Careers.razor.rz.scp.css */
/* Careers Page - Public Job Listing */
.careers-page[b-zxohd9nfj6] {
    background: transparent;
}

/* Hero Section */
.careers-hero[b-zxohd9nfj6] {
    background: linear-gradient(135deg, #004f3c 0%, #00261c 50%, #001a13 100%);
    color: white;
    padding: 5rem 2rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.careers-hero[b-zxohd9nfj6]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23d3b890' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events: none;
}

.hero-content[b-zxohd9nfj6] {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
}

.hero-content h1[b-zxohd9nfj6] {
    font-size: 3rem;
    font-weight: 700;
    margin: 0 0 1rem;
    letter-spacing: -0.5px;
    line-height: 1.2;
    padding: 0.1em 0;
    background: linear-gradient(135deg, #ffffff 0%, #d3b890 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-content p[b-zxohd9nfj6] {
    font-size: 1.2rem;
    opacity: 0.85;
    margin: 0;
    color: #d3b890;
    font-weight: 300;
}

/* Content Section */
.careers-content[b-zxohd9nfj6] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
}

/* Loading */
.loading-container[b-zxohd9nfj6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
}

/* No Jobs */
.no-jobs[b-zxohd9nfj6] {
    text-align: center;
    padding: 4rem 2rem;
}

.no-jobs h2[b-zxohd9nfj6] {
    margin: 1rem 0 0.5rem;
    color: var(--rz-text-color);
}

.no-jobs p[b-zxohd9nfj6] {
    color: var(--rz-text-secondary-color);
}

/* Jobs Header */
.jobs-header[b-zxohd9nfj6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.jobs-header h2[b-zxohd9nfj6] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
}

.job-count[b-zxohd9nfj6] {
    color: var(--rz-text-tertiary-color);
    font-weight: 400;
}

.jobs-filter[b-zxohd9nfj6] {
    display: flex;
    gap: 0.75rem;
}

.search-box[b-zxohd9nfj6]  .rz-textbox {
    min-width: 250px;
    border-radius: 8px;
}

.dept-filter[b-zxohd9nfj6] {
    min-width: 180px;
}

/* Jobs Grid */
.jobs-grid[b-zxohd9nfj6] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.25rem;
}

/* Job Card */
.job-card[b-zxohd9nfj6] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    border: 2px solid transparent;
}

.job-card:hover[b-zxohd9nfj6] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    border-color: var(--rz-primary-lighter);
    transform: translateY(-2px);
}

.job-card-header[b-zxohd9nfj6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.job-card-header h3[b-zxohd9nfj6] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--rz-text-color);
    line-height: 1.3;
}

.remote-badge[b-zxohd9nfj6] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.25rem 0.5rem;
    background: #ecfdf5;
    color: #047857;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

.remote-badge[b-zxohd9nfj6]  .rz-icon {
    font-size: 0.9rem;
}

/* Job Card Meta */
.job-card-meta[b-zxohd9nfj6] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
    flex: 1;
}

.meta-item[b-zxohd9nfj6] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.85rem;
    color: var(--rz-text-secondary-color);
}

.meta-item[b-zxohd9nfj6]  .rz-icon {
    font-size: 1rem;
    color: var(--rz-text-tertiary-color);
}

/* Job Card Footer */
.job-card-footer[b-zxohd9nfj6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid var(--rz-base-200);
    margin-top: auto;
}

.posted-date[b-zxohd9nfj6] {
    font-size: 0.8rem;
    color: var(--rz-text-tertiary-color);
}

/* No Results */
.no-results[b-zxohd9nfj6] {
    text-align: center;
    padding: 2rem;
    color: var(--rz-text-secondary-color);
}

.no-results a[b-zxohd9nfj6] {
    color: var(--rz-primary);
    cursor: pointer;
}

/* Responsive */
@media (max-width: 768px) {
    .careers-hero[b-zxohd9nfj6] {
        padding: 3rem 1.5rem;
    }

    .hero-content h1[b-zxohd9nfj6] {
        font-size: 2rem;
    }

    .hero-content p[b-zxohd9nfj6] {
        font-size: 1rem;
    }

    .careers-content[b-zxohd9nfj6] {
        padding: 1.5rem 1rem;
    }

    .jobs-header[b-zxohd9nfj6] {
        flex-direction: column;
        align-items: stretch;
    }

    .jobs-filter[b-zxohd9nfj6] {
        flex-direction: column;
    }

    .search-box[b-zxohd9nfj6]  .rz-textbox {
        min-width: unset;
        width: 100%;
    }

    .dept-filter[b-zxohd9nfj6] {
        min-width: unset;
        width: 100%;
    }

    .jobs-grid[b-zxohd9nfj6] {
        grid-template-columns: 1fr;
    }

    .job-card-header[b-zxohd9nfj6] {
        flex-direction: column;
    }

    .remote-badge[b-zxohd9nfj6] {
        align-self: flex-start;
    }
}
/* /Components/Pages/Talent/Dashboard.razor.rz.scp.css */
/* Dashboard Page Styles */
.dashboard-page[b-qmm6m04cth] {
    padding: 1rem;
    max-width: 1400px;
    margin: 0 auto;
    background: var(--rz-base-100);
    min-height: 100vh;
}

.page-header[b-qmm6m04cth] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.header-title-row[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-content h1[b-qmm6m04cth] {
    margin: 0;
    font-size: 1.5rem;
}

.header-content p[b-qmm6m04cth] {
    margin: 0.25rem 0 0;
    color: var(--rz-text-secondary-color);
    font-size: 0.875rem;
}

.header-actions[b-qmm6m04cth] {
    display: flex;
    gap: 0.5rem;
}

.loading-container[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
}

/* Summary Cards */
.summary-cards[b-qmm6m04cth] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.summary-card[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: all 0.2s ease;
    border-left: 4px solid transparent;
}

.summary-card:hover[b-qmm6m04cth] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.summary-card.pending-votes[b-qmm6m04cth] {
    border-left-color: #6366f1;
}

.summary-card.pending-votes .card-icon[b-qmm6m04cth] {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
}

.summary-card.my-jobs[b-qmm6m04cth] {
    border-left-color: #0ea5e9;
}

.summary-card.my-jobs .card-icon[b-qmm6m04cth] {
    background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
}

.summary-card.attention[b-qmm6m04cth] {
    border-left-color: #f97316;
}

.summary-card.attention .card-icon[b-qmm6m04cth] {
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
}

.summary-card.consensus[b-qmm6m04cth] {
    border-left-color: #8b5cf6;
}

.summary-card.consensus .card-icon[b-qmm6m04cth] {
    background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
}

.card-icon[b-qmm6m04cth] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.card-icon[b-qmm6m04cth]  .rz-icon {
    font-size: 28px;
    color: white;
}

.card-content[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
}

.card-value[b-qmm6m04cth] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
}

.card-label[b-qmm6m04cth] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    margin-top: 0.125rem;
}

/* Dashboard Grid */
.dashboard-grid[b-qmm6m04cth] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.dashboard-section[b-qmm6m04cth] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.dashboard-section.wide[b-qmm6m04cth] {
    grid-column: 1 / -1;
}

.section-header[b-qmm6m04cth] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.section-header h2[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.section-header h2[b-qmm6m04cth]  .rz-icon {
    font-size: 20px;
    color: var(--rz-primary);
}

/* Empty Section */
.empty-section[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: var(--rz-text-disabled-color);
    text-align: center;
}

.empty-section[b-qmm6m04cth]  .rz-icon {
    font-size: 48px;
    margin-bottom: 0.5rem;
    opacity: 0.5;
}

.empty-section p[b-qmm6m04cth] {
    margin: 0;
}

/* Candidate List (Pending Votes) */
.candidate-list[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.candidate-card[b-qmm6m04cth] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.875rem;
    background: var(--rz-base-50);
    border-radius: 8px;
    transition: background 0.15s ease;
}

.candidate-card:hover[b-qmm6m04cth] {
    background: var(--rz-base-100);
}

.candidate-info[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.candidate-avatar[b-qmm6m04cth] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 600;
    flex-shrink: 0;
}

.candidate-details[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.candidate-name[b-qmm6m04cth] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--rz-text-color);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.candidate-name:hover[b-qmm6m04cth] {
    color: var(--rz-primary);
    text-decoration: underline;
}

.candidate-job[b-qmm6m04cth] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.candidate-meta[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.days-tag[b-qmm6m04cth] {
    font-size: 0.7rem;
    color: var(--rz-text-disabled-color);
}

.candidate-actions[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.vote-summary[b-qmm6m04cth] {
    display: flex;
    gap: 0.25rem;
}

.vote-count[b-qmm6m04cth] {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
}

.vote-count.yes[b-qmm6m04cth] {
    background: #dcfce7;
    color: #166534;
}

.vote-count.no[b-qmm6m04cth] {
    background: #fee2e2;
    color: #991b1b;
}

.action-buttons[b-qmm6m04cth] {
    display: flex;
    gap: 0.25rem;
}

/* Jobs List */
.jobs-list[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.job-card[b-qmm6m04cth] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.875rem;
    background: var(--rz-base-50);
    border-radius: 8px;
    transition: background 0.15s ease;
}

.job-card:hover[b-qmm6m04cth] {
    background: var(--rz-base-100);
}

.job-card.inactive[b-qmm6m04cth] {
    opacity: 0.7;
}

.job-info[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
    flex: 1;
}

.job-title[b-qmm6m04cth] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--rz-text-color);
    text-decoration: none;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.job-title:hover[b-qmm6m04cth] {
    color: var(--rz-primary);
    text-decoration: underline;
}

.job-meta[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.job-department[b-qmm6m04cth] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.job-stats[b-qmm6m04cth] {
    display: flex;
    gap: 0.75rem;
}

.stat[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 45px;
}

.stat-value[b-qmm6m04cth] {
    font-size: 1rem;
    font-weight: 700;
}

.stat-label[b-qmm6m04cth] {
    font-size: 0.65rem;
    color: var(--rz-text-secondary-color);
    text-transform: uppercase;
}

.stat.highlight .stat-value[b-qmm6m04cth] {
    color: #6366f1;
}

.stat.warning .stat-value[b-qmm6m04cth] {
    color: #f97316;
}

.stat.success .stat-value[b-qmm6m04cth] {
    color: #22c55e;
}

/* Attention List */
.attention-list[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.attention-card[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem;
    background: var(--rz-base-50);
    border-radius: 8px;
    position: relative;
}

.urgency-indicator[b-qmm6m04cth] {
    width: 4px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 8px 0 0 8px;
}

.attention-card.warning .urgency-indicator[b-qmm6m04cth] {
    background: #f97316;
}

.attention-card.critical .urgency-indicator[b-qmm6m04cth] {
    background: #ef4444;
}

.attention-info[b-qmm6m04cth] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    padding-left: 0.5rem;
}

.attention-meta[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.days-warning[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    color: #f97316;
}

.days-warning[b-qmm6m04cth]  .rz-icon {
    font-size: 14px;
}

.attention-actions[b-qmm6m04cth] {
    flex-shrink: 0;
}

/* Consensus List */
.consensus-list[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.consensus-card[b-qmm6m04cth] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem;
    background: var(--rz-base-50);
    border-radius: 8px;
}

.consensus-info[b-qmm6m04cth] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.vote-breakdown[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 120px;
}

.vote-bar[b-qmm6m04cth] {
    height: 8px;
    background: var(--rz-base-200);
    border-radius: 4px;
    overflow: hidden;
    display: flex;
}

.bar-segment[b-qmm6m04cth] {
    height: 100%;
    transition: width 0.3s ease;
}

.bar-segment.yes[b-qmm6m04cth] {
    background: #22c55e;
}

.bar-segment.no[b-qmm6m04cth] {
    background: #ef4444;
}

.vote-counts[b-qmm6m04cth] {
    display: flex;
    gap: 0.5rem;
    font-size: 0.7rem;
    font-weight: 500;
}

.vote-counts .yes[b-qmm6m04cth] {
    color: #22c55e;
}

.vote-counts .no[b-qmm6m04cth] {
    color: #ef4444;
}

.vote-counts .maybe[b-qmm6m04cth] {
    color: #f59e0b;
}

/* Activity Timeline */
.activity-timeline[b-qmm6m04cth] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activity-item[b-qmm6m04cth] {
    display: flex;
    gap: 0.75rem;
    padding: 0.5rem;
    border-radius: 6px;
    transition: background 0.15s ease;
}

.activity-item:hover[b-qmm6m04cth] {
    background: var(--rz-base-50);
}

.activity-icon[b-qmm6m04cth] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--rz-base-100);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.activity-icon[b-qmm6m04cth]  .rz-icon {
    font-size: 16px;
    color: var(--rz-text-secondary-color);
}

.activity-content[b-qmm6m04cth] {
    flex: 1;
    min-width: 0;
}

.activity-header[b-qmm6m04cth] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.activity-type[b-qmm6m04cth] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rz-primary);
}

.activity-time[b-qmm6m04cth] {
    font-size: 0.7rem;
    color: var(--rz-text-disabled-color);
}

.activity-body[b-qmm6m04cth] {
    font-size: 0.85rem;
}

.candidate-link[b-qmm6m04cth] {
    color: var(--rz-text-color);
    font-weight: 500;
    text-decoration: none;
}

.candidate-link:hover[b-qmm6m04cth] {
    color: var(--rz-primary);
    text-decoration: underline;
}

.activity-job[b-qmm6m04cth] {
    color: var(--rz-text-secondary-color);
}

.activity-note[b-qmm6m04cth] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    margin: 0.25rem 0 0;
    font-style: italic;
}

/* Responsive */
@media (max-width: 1200px) {
    .summary-cards[b-qmm6m04cth] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .dashboard-page[b-qmm6m04cth] {
        padding: 0.75rem;
    }

    .page-header[b-qmm6m04cth] {
        flex-direction: column;
    }

    .header-actions[b-qmm6m04cth] {
        width: 100%;
    }

    .header-actions[b-qmm6m04cth]  .rz-button {
        flex: 1;
    }

    .summary-cards[b-qmm6m04cth] {
        grid-template-columns: repeat(2, 1fr);
    }

    .summary-card[b-qmm6m04cth] {
        padding: 1rem;
    }

    .card-icon[b-qmm6m04cth] {
        width: 48px;
        height: 48px;
    }

    .card-icon[b-qmm6m04cth]  .rz-icon {
        font-size: 24px;
    }

    .card-value[b-qmm6m04cth] {
        font-size: 1.5rem;
    }

    .dashboard-grid[b-qmm6m04cth] {
        grid-template-columns: 1fr;
    }

    .candidate-card[b-qmm6m04cth],
    .job-card[b-qmm6m04cth],
    .attention-card[b-qmm6m04cth],
    .consensus-card[b-qmm6m04cth] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .candidate-actions[b-qmm6m04cth],
    .job-stats[b-qmm6m04cth] {
        width: 100%;
        justify-content: space-between;
    }

    .vote-breakdown[b-qmm6m04cth] {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .summary-cards[b-qmm6m04cth] {
        grid-template-columns: 1fr;
    }

    .job-stats[b-qmm6m04cth] {
        flex-wrap: wrap;
    }

    .action-buttons[b-qmm6m04cth] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Talent/EditCandidate.razor.rz.scp.css */
/* Edit Candidate Page Styles */
.talent-page[b-4yx32dywee] {
    padding: 1rem;
    max-width: 800px;
    margin: 0 auto;
}

.page-header[b-4yx32dywee] {
    margin-bottom: 1.5rem;
}

.page-header h1[b-4yx32dywee] {
    font-size: 1.5rem;
    margin: 0;
}

.loading-container[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 1rem;
}

.form-container[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.form-section[b-4yx32dywee] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.section-title[b-4yx32dywee] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.section-title[b-4yx32dywee]  .rz-icon {
    font-size: 1.25rem;
    color: var(--rz-primary);
}

.form-grid[b-4yx32dywee] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.form-grid.three-col[b-4yx32dywee] {
    grid-template-columns: repeat(3, 1fr);
}

.form-field[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.form-field.full-width[b-4yx32dywee] {
    grid-column: 1 / -1;
}

.form-field[b-4yx32dywee]  .rz-label {
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
}

.form-actions[b-4yx32dywee] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--rz-base-200);
}

/* Resume Upload - Modern Drag & Drop */
.resume-section[b-4yx32dywee] {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 1px solid #bae6fd;
}

.resume-upload-container[b-4yx32dywee] {
    position: relative;
}

/* Label wraps the hidden file input and covers the drop zone */
.resume-drop-label[b-4yx32dywee] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
    display: block;
}

/* Hide the actual file input inside the label */
.resume-drop-label input[type="file"][b-4yx32dywee],
.resume-drop-label[b-4yx32dywee]  input[type="file"] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.resume-drop-zone[b-4yx32dywee] {
    min-height: 140px;
    border: 2px dashed var(--rz-base-400);
    border-radius: 12px;
    background: white;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.resume-drop-zone.dragging[b-4yx32dywee] {
    border-color: var(--rz-primary);
    background: var(--rz-primary-lighter);
    transform: scale(1.01);
}

.resume-drop-zone.has-file[b-4yx32dywee] {
    border-style: solid;
    border-color: var(--rz-base-300);
}

/* Upload Prompt */
.upload-prompt[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 1.5rem;
    text-align: center;
}

.upload-prompt .upload-icon[b-4yx32dywee] {
    font-size: 48px !important;
    color: var(--rz-primary);
    margin-bottom: 0.5rem;
}

.upload-prompt .upload-text[b-4yx32dywee] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--rz-text-color);
}

.upload-prompt .upload-or[b-4yx32dywee] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.upload-prompt .upload-browse[b-4yx32dywee] {
    font-size: 0.9rem;
    color: var(--rz-primary);
    font-weight: 500;
}

.upload-prompt .upload-formats[b-4yx32dywee] {
    font-size: 0.75rem;
    color: var(--rz-text-disabled-color);
    margin-top: 0.5rem;
}

/* File Preview */
.resume-file-preview[b-4yx32dywee] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    width: 100%;
    pointer-events: auto;
}

.resume-file-preview .file-icon[b-4yx32dywee] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.resume-file-preview .file-icon[b-4yx32dywee]  .rz-icon {
    font-size: 24px;
    color: white;
}

.resume-file-preview .file-icon.success[b-4yx32dywee] {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
}

.resume-file-preview .file-details[b-4yx32dywee] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.resume-file-preview .file-name[b-4yx32dywee] {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--rz-text-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.resume-file-preview .file-status[b-4yx32dywee] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.resume-file-preview.existing .file-status[b-4yx32dywee] {
    color: #16a34a;
}

.resume-file-preview .remove-btn[b-4yx32dywee] {
    pointer-events: auto;
    z-index: 3;
}

/* AI Extracted State */
.resume-file-preview.ai-extracted .file-status[b-4yx32dywee] {
    color: #8b5cf6;
    font-weight: 500;
}

.resume-file-preview.ai-extracted .file-icon[b-4yx32dywee] {
    background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
}

/* AI Prompt Container */
.ai-prompt-container[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem;
    text-align: center;
    pointer-events: auto;
    width: 100%;
}

.ai-prompt-icon[b-4yx32dywee] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: pulse-glow-b-4yx32dywee 2s ease-in-out infinite;
}

.ai-prompt-icon[b-4yx32dywee]  .rz-icon {
    font-size: 28px;
    color: white;
}

@keyframes pulse-glow-b-4yx32dywee {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4);
    }
    50% {
        box-shadow: 0 0 20px 8px rgba(139, 92, 246, 0.2);
    }
}

.ai-prompt-content[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.ai-prompt-title[b-4yx32dywee] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--rz-text-color);
}

.ai-prompt-text[b-4yx32dywee] {
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
}

.ai-prompt-actions[b-4yx32dywee] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

/* Parsing Overlay */
.resume-drop-zone.parsing[b-4yx32dywee] {
    border-color: #8b5cf6;
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
}

.parsing-overlay[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem;
    text-align: center;
}

.parsing-overlay[b-4yx32dywee]  .rz-progressbar-circular {
    --rz-progressbar-circular-track-color: #e9d5ff;
    --rz-progressbar-circular-value-color: #8b5cf6;
}

.parsing-text[b-4yx32dywee] {
    font-size: 1rem;
    font-weight: 600;
    color: #6d28d9;
}

.parsing-subtext[b-4yx32dywee] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

/* Responsive */
@media (max-width: 768px) {
    .talent-page[b-4yx32dywee] {
        padding: 0.75rem;
    }

    .form-section[b-4yx32dywee] {
        padding: 1rem;
    }

    .form-grid[b-4yx32dywee],
    .form-grid.three-col[b-4yx32dywee] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-4yx32dywee] {
        flex-direction: column;
    }

    .form-actions[b-4yx32dywee]  .rz-button {
        width: 100%;
    }

    .resume-drop-zone[b-4yx32dywee] {
        min-height: 120px;
    }

    .upload-prompt .upload-icon[b-4yx32dywee] {
        font-size: 36px !important;
    }

    .upload-prompt .upload-text[b-4yx32dywee] {
        font-size: 0.9rem;
    }

    .resume-file-preview[b-4yx32dywee] {
        padding: 0.75rem;
        gap: 0.75rem;
    }

    .resume-file-preview .file-icon[b-4yx32dywee] {
        width: 40px;
        height: 40px;
    }

    .resume-file-preview .file-icon[b-4yx32dywee]  .rz-icon {
        font-size: 20px;
    }

    .ai-prompt-container[b-4yx32dywee] {
        padding: 1rem;
        gap: 0.5rem;
    }

    .ai-prompt-icon[b-4yx32dywee] {
        width: 48px;
        height: 48px;
    }

    .ai-prompt-icon[b-4yx32dywee]  .rz-icon {
        font-size: 24px;
    }

    .ai-prompt-title[b-4yx32dywee] {
        font-size: 0.9rem;
    }

    .ai-prompt-text[b-4yx32dywee] {
        font-size: 0.8rem;
    }

    .ai-prompt-actions[b-4yx32dywee] {
        flex-direction: column;
        width: 100%;
    }

    .ai-prompt-actions[b-4yx32dywee]  .rz-button {
        width: 100%;
    }

    .parsing-overlay[b-4yx32dywee] {
        padding: 1rem;
    }

    .parsing-text[b-4yx32dywee] {
        font-size: 0.9rem;
    }

    .add-document-row[b-4yx32dywee] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .pending-document-item[b-4yx32dywee] {
        padding: 0.75rem;
    }

    .doc-icon[b-4yx32dywee] {
        width: 36px;
        height: 36px;
    }

    .doc-icon[b-4yx32dywee]  .rz-icon {
        font-size: 18px;
    }
}

/* Additional Documents Section */
.documents-section[b-4yx32dywee] {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
}

.section-hint[b-4yx32dywee] {
    font-size: 0.85rem;
    color: var(--rz-text-secondary-color);
    margin: -0.5rem 0 1rem 0;
}

.pending-documents-list[b-4yx32dywee] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.pending-document-item[b-4yx32dywee] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: white;
    border: 1px solid var(--rz-base-300);
    border-radius: 8px;
    transition: all 0.15s ease;
}

.pending-document-item:hover[b-4yx32dywee] {
    border-color: var(--rz-primary);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.doc-icon[b-4yx32dywee] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.doc-icon[b-4yx32dywee]  .rz-icon {
    font-size: 20px;
    color: white;
}

.doc-details[b-4yx32dywee] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.doc-name[b-4yx32dywee] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--rz-text-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.doc-type[b-4yx32dywee] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.add-document-row[b-4yx32dywee] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.add-doc-label[b-4yx32dywee] {
    display: inline-flex;
    cursor: pointer;
    position: relative;
}

.add-doc-label.disabled[b-4yx32dywee] {
    cursor: not-allowed;
    opacity: 0.6;
}

.add-doc-label input[type="file"][b-4yx32dywee] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.add-doc-label.disabled input[type="file"][b-4yx32dywee] {
    cursor: not-allowed;
}
/* /Components/Pages/Talent/EditJob.razor.rz.scp.css */
/* Modern Job Editor - Profile Style Layout */
.job-editor[b-ghdqv165e4] {
    min-height: 100vh;
    background: var(--rz-base-100);
}

/* Sticky Header */
.editor-header[b-ghdqv165e4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 2rem;
    background: white;
    border-bottom: 1px solid var(--rz-base-200);
    position: sticky;
    top: 0;
    z-index: 100;
    gap: 1rem;
}

.header-left[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex: 1;
    min-width: 0;
}

.back-btn[b-ghdqv165e4] {
    flex-shrink: 0;
}

.header-info[b-ghdqv165e4] {
    min-width: 0;
}

.header-info h1[b-ghdqv165e4] {
    font-size: 1.25rem;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.header-meta[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.25rem;
}

.meta-date[b-ghdqv165e4] {
    font-size: 0.8rem;
    color: var(--rz-text-tertiary-color);
}

.header-actions[b-ghdqv165e4] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* Loading */
.loading-container[b-ghdqv165e4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
}

/* Main Layout - Two Column */
.editor-body[b-ghdqv165e4] {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
    padding: 1.5rem 2rem;
}

/* Main Content Area */
.main-content[b-ghdqv165e4] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Hero Section - Job Title */
.hero-section[b-ghdqv165e4] {
    background: white;
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.hero-input[b-ghdqv165e4]  .rz-textbox {
    font-size: 1.5rem;
    font-weight: 600;
    padding: 0.75rem 0;
    border: none;
    border-bottom: 2px solid var(--rz-base-200);
    border-radius: 0;
    background: transparent;
}

.hero-input[b-ghdqv165e4]  .rz-textbox:focus {
    border-bottom-color: var(--rz-primary);
    box-shadow: none;
}

.hero-input[b-ghdqv165e4]  .rz-textbox::placeholder {
    color: var(--rz-text-tertiary-color);
    font-weight: 400;
}

.hero-row[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-top: 1rem;
}

.hero-row .form-field[b-ghdqv165e4] {
    flex: 1;
    margin: 0;
}

.remote-toggle[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: var(--rz-base-50);
    border-radius: 8px;
    flex-shrink: 0;
}

.remote-toggle label[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
}

.remote-toggle[b-ghdqv165e4]  .rz-icon {
    color: var(--rz-primary);
    font-size: 1.1rem;
}

/* Content Sections */
.content-section[b-ghdqv165e4] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.section-header[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--rz-base-100);
}

.section-header[b-ghdqv165e4]  .rz-icon {
    color: var(--rz-primary);
    font-size: 1.25rem;
}

.section-header h2[b-ghdqv165e4] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    flex: 1;
}

.section-toggle[b-ghdqv165e4] {
    margin-left: auto;
}

.section-body[b-ghdqv165e4] {
    padding: 1.5rem;
}

/* Requirements Builder */
.requirements-builder[b-ghdqv165e4] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.requirement-row[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.req-number[b-ghdqv165e4] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 600;
    flex-shrink: 0;
}

.remove-req[b-ghdqv165e4] {
    opacity: 0;
    transition: opacity 0.15s;
}

.requirement-row:hover .remove-req[b-ghdqv165e4] {
    opacity: 1;
}

.add-req-btn[b-ghdqv165e4] {
    align-self: flex-start;
    margin-top: 0.5rem;
}

/* Sidebar */
.sidebar[b-ghdqv165e4] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.sidebar-card[b-ghdqv165e4] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.card-title[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-weight: 600;
    font-size: 0.9rem;
}

.card-title[b-ghdqv165e4]  .rz-icon {
    color: var(--rz-primary);
    font-size: 1.1rem;
}

.internal-badge[b-ghdqv165e4] {
    margin-left: auto;
    font-size: 0.65rem;
    padding: 0.2rem 0.5rem;
    background: #fef3c7;
    color: #92400e;
    border-radius: 4px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Status Grid */
.status-grid[b-ghdqv165e4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.status-chip[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 0.75rem;
    border: 2px solid var(--rz-base-200);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 0.8rem;
    font-weight: 500;
}

.status-chip:hover[b-ghdqv165e4] {
    border-color: var(--rz-primary-lighter);
    background: var(--rz-base-50);
}

.status-chip.selected[b-ghdqv165e4] {
    border-color: var(--rz-primary);
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
}

.status-chip[b-ghdqv165e4]  .rz-icon {
    font-size: 1rem;
}

/* Detail Fields */
.detail-field[b-ghdqv165e4] {
    margin-bottom: 1rem;
}

.detail-field:last-child[b-ghdqv165e4] {
    margin-bottom: 0;
}

.detail-field label[b-ghdqv165e4] {
    display: block;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--rz-text-secondary-color);
    margin-bottom: 0.35rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Salary Range */
.salary-range-display[b-ghdqv165e4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

/* Team Card */
.team-card[b-ghdqv165e4] {
    padding-bottom: 0.75rem;
}

.team-role-section[b-ghdqv165e4] {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--rz-base-100);
}

.team-role-section:last-child[b-ghdqv165e4] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.role-header[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rz-text-secondary-color);
    margin-bottom: 0.75rem;
}

.role-header[b-ghdqv165e4]  .rz-icon {
    font-size: 1rem;
    color: var(--rz-text-tertiary-color);
}

.role-members[b-ghdqv165e4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.team-chip[b-ghdqv165e4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.5rem;
    background: var(--rz-base-50);
    border-radius: 6px;
}

.chip-avatar[b-ghdqv165e4] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--rz-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 600;
    flex-shrink: 0;
}

.chip-name[b-ghdqv165e4] {
    flex: 1;
    font-size: 0.8rem;
    font-weight: 500;
}

.chip-remove[b-ghdqv165e4] {
    opacity: 0;
    transition: opacity 0.15s;
}

.team-chip:hover .chip-remove[b-ghdqv165e4] {
    opacity: 1;
}

/* Primary Hiring Manager Styles */
.team-chip.primary-hm[b-ghdqv165e4] {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 1px solid #f59e0b;
}

.primary-star[b-ghdqv165e4] {
    margin-right: 0.25rem;
}

.primary-star[b-ghdqv165e4]  .rz-icon {
    font-size: 1rem;
}

.primary-badge[b-ghdqv165e4] {
    font-size: 0.6rem;
    padding: 0.15rem 0.4rem;
    background: #f59e0b;
    color: white;
    border-radius: 4px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-left: auto;
    margin-right: 0.25rem;
}

.add-member-row[b-ghdqv165e4] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    padding: 0.5rem;
    border-radius: 8px;
    transition: all 0.2s ease;
    margin: -0.5rem;
}

.add-member-row.has-pending[b-ghdqv165e4] {
    background: #ecfdf5;
    border: 1px dashed #10b981;
}

.pulse-btn[b-ghdqv165e4] {
    animation: pulse-green-b-ghdqv165e4 1.5s infinite;
}

@keyframes pulse-green-b-ghdqv165e4 {
    0% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5);
    }
    70% {
        box-shadow: 0 0 0 8px rgba(16, 185, 129, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
    }
}

/* Form Field Defaults */
.form-field[b-ghdqv165e4] {
    margin-bottom: 1rem;
}

.form-field:last-child[b-ghdqv165e4] {
    margin-bottom: 0;
}

/* HTML Editor Overrides */
[b-ghdqv165e4] .rz-html-editor {
    border-radius: 8px;
    border: 1px solid var(--rz-base-300);
}

[b-ghdqv165e4] .rz-html-editor-toolbar {
    border-radius: 8px 8px 0 0;
    background: var(--rz-base-50);
}

[b-ghdqv165e4] .rz-html-editor-content {
    min-height: 200px;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .editor-body[b-ghdqv165e4] {
        grid-template-columns: 1fr;
        padding: 1rem;
    }

    .sidebar[b-ghdqv165e4] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }

    .team-card[b-ghdqv165e4] {
        grid-column: span 2;
    }
}

@media (max-width: 768px) {
    .editor-header[b-ghdqv165e4] {
        flex-direction: column;
        align-items: stretch;
        padding: 1rem;
    }

    .header-left[b-ghdqv165e4] {
        width: 100%;
    }

    .header-actions[b-ghdqv165e4] {
        width: 100%;
        justify-content: stretch;
    }

    .header-actions[b-ghdqv165e4]  .rz-button {
        flex: 1;
    }

    .hero-section[b-ghdqv165e4] {
        padding: 1.25rem;
    }

    .hero-input[b-ghdqv165e4]  .rz-textbox {
        font-size: 1.25rem;
    }

    .hero-row[b-ghdqv165e4] {
        flex-direction: column;
        align-items: stretch;
    }

    .remote-toggle[b-ghdqv165e4] {
        justify-content: center;
    }

    .sidebar[b-ghdqv165e4] {
        grid-template-columns: 1fr;
    }

    .team-card[b-ghdqv165e4] {
        grid-column: span 1;
    }

    .status-grid[b-ghdqv165e4] {
        grid-template-columns: 1fr;
    }

    .salary-range-display[b-ghdqv165e4] {
        grid-template-columns: 1fr;
    }

    .section-body[b-ghdqv165e4] {
        padding: 1rem;
    }
}

/* Dropdown Styling */
[b-ghdqv165e4] .rz-dropdown {
    border-radius: 6px;
}

/* Numeric Input Styling */
[b-ghdqv165e4] .rz-numeric {
    border-radius: 6px;
}
/* /Components/Pages/Talent/Jobs.razor.rz.scp.css */
/* ========================================================================= */
/* JOBS PAGE - MODERN DESIGN                                                */
/* ========================================================================= */

.jobs-page[b-qbdrqafo4a] {
    max-width: 1400px;
    margin: 0 auto;
    background: var(--rz-base-100);
    min-height: 100vh;
}

/* ========================================================================= */
/* HEADER                                                                    */
/* ========================================================================= */

.page-header[b-qbdrqafo4a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: white;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.header-title-row[b-qbdrqafo4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-left h1[b-qbdrqafo4a] {
    font-size: 1.75rem;
    margin: 0;
    color: var(--rz-text-color);
}

.header-subtitle[b-qbdrqafo4a] {
    margin: 0.25rem 0 0;
    color: var(--rz-text-secondary-color);
    font-size: 0.9rem;
}

.add-job-btn[b-qbdrqafo4a] {
    padding: 0.75rem 1.5rem !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
}

/* ========================================================================= */
/* STATS ROW                                                                 */
/* ========================================================================= */

.stats-row[b-qbdrqafo4a] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.stat-card[b-qbdrqafo4a] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    background: white;
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s;
}

.stat-card:hover[b-qbdrqafo4a] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.stat-icon[b-qbdrqafo4a] {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.stat-icon[b-qbdrqafo4a]  .rz-icon {
    font-size: 26px;
    color: white;
}

.stat-icon.total[b-qbdrqafo4a] {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
}

.stat-icon.open[b-qbdrqafo4a] {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
}

.stat-icon.active[b-qbdrqafo4a] {
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
}

.stat-icon.hired[b-qbdrqafo4a] {
    background: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%);
}

.stat-info[b-qbdrqafo4a] {
    display: flex;
    flex-direction: column;
}

.stat-value[b-qbdrqafo4a] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--rz-text-color);
}

.stat-label[b-qbdrqafo4a] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    font-weight: 500;
    margin-top: 0.125rem;
}

/* ========================================================================= */
/* FILTERS BAR                                                               */
/* ========================================================================= */

.filters-bar[b-qbdrqafo4a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: white;
    border-radius: 12px;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.filters-left[b-qbdrqafo4a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.status-filter[b-qbdrqafo4a] {
    min-width: 160px;
}

.search-wrapper[b-qbdrqafo4a] {
    position: relative;
    display: flex;
    align-items: center;
}

.search-icon[b-qbdrqafo4a] {
    position: absolute;
    left: 12px;
    color: var(--rz-text-disabled-color);
    font-size: 18px;
    pointer-events: none;
}

.search-input[b-qbdrqafo4a]  .rz-textbox {
    padding-left: 38px;
    min-width: 240px;
    border-radius: 10px;
}

.filters-right[b-qbdrqafo4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.refresh-btn[b-qbdrqafo4a] {
    border-radius: 10px !important;
}

/* ========================================================================= */
/* LOADING & EMPTY STATE                                                     */
/* ========================================================================= */

.loading-container[b-qbdrqafo4a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.empty-state[b-qbdrqafo4a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: white;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    gap: 0.5rem;
}

.empty-state h3[b-qbdrqafo4a] {
    margin: 0.75rem 0 0;
    font-size: 1.25rem;
    color: var(--rz-text-color);
}

.empty-state p[b-qbdrqafo4a] {
    margin: 0.25rem 0 1.25rem;
    color: var(--rz-text-secondary-color);
}

/* ========================================================================= */
/* DESKTOP GRID                                                              */
/* ========================================================================= */

.desktop-view[b-qbdrqafo4a] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

[b-qbdrqafo4a] .talent-grid {
    border: none !important;
}

[b-qbdrqafo4a] .talent-grid .rz-data-row:hover {
    background: var(--rz-base-50);
}

.job-title-cell[b-qbdrqafo4a] {
    display: flex;
    align-items: center;
}

.job-link[b-qbdrqafo4a] {
    color: var(--rz-primary);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s;
}

.job-link:hover[b-qbdrqafo4a] {
    color: var(--rz-primary-dark);
    text-decoration: underline;
}

.count-badge[b-qbdrqafo4a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    padding: 0.35rem 0.6rem;
    background: var(--rz-primary);
    color: white;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.count-badge.muted[b-qbdrqafo4a] {
    background: var(--rz-base-300);
    color: var(--rz-text-secondary-color);
}

/* ========================================================================= */
/* MOBILE VIEW                                                               */
/* ========================================================================= */

.mobile-view[b-qbdrqafo4a] {
    display: none;
}

.job-card[b-qbdrqafo4a] {
    background: white;
    border-radius: 14px;
    padding: 1.25rem;
    margin-bottom: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    border-left: 4px solid var(--rz-primary);
}

.job-card:hover[b-qbdrqafo4a] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.job-card:active[b-qbdrqafo4a] {
    transform: scale(0.98);
}

.job-card-header[b-qbdrqafo4a] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.job-card-title[b-qbdrqafo4a] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    color: var(--rz-text-color);
    flex: 1;
}

.job-card-meta[b-qbdrqafo4a] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.85rem;
    color: var(--rz-text-secondary-color);
    margin-bottom: 1rem;
}

.job-card-meta span[b-qbdrqafo4a] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.job-card-meta[b-qbdrqafo4a]  .rz-icon {
    font-size: 16px;
    opacity: 0.7;
}

.job-card-stats[b-qbdrqafo4a] {
    display: flex;
    gap: 2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--rz-base-200);
}

.job-card-stats .stat[b-qbdrqafo4a] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.job-card-stats .stat-value[b-qbdrqafo4a] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--rz-primary);
}

.job-card-stats .stat-label[b-qbdrqafo4a] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.job-card-actions[b-qbdrqafo4a] {
    display: flex;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--rz-base-200);
    margin-top: 1rem;
}

.job-card-actions[b-qbdrqafo4a]  .rz-button {
    flex: 1;
}

/* Help Panel */
.help-panel[b-qbdrqafo4a] {
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfeff 100%);
    border: 1px solid #86efac;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}

.help-panel-header[b-qbdrqafo4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.help-panel-header[b-qbdrqafo4a]  .rz-icon {
    color: var(--rz-primary);
}

.help-panel-header strong[b-qbdrqafo4a] {
    flex: 1;
    color: var(--rz-text-color);
}

.help-close-btn[b-qbdrqafo4a] {
    margin-left: auto;
}

.help-panel p[b-qbdrqafo4a] {
    margin: 0 0 0.5rem;
    color: var(--rz-text-secondary-color);
    font-size: 0.9rem;
}

.help-panel ul[b-qbdrqafo4a] {
    margin: 0;
    padding-left: 1.25rem;
}

.help-panel li[b-qbdrqafo4a] {
    margin-bottom: 0.25rem;
    font-size: 0.85rem;
    color: var(--rz-text-secondary-color);
}

/* ========================================================================= */
/* RESPONSIVE                                                                */
/* ========================================================================= */

@media (max-width: 1024px) {
    .stats-row[b-qbdrqafo4a] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .jobs-page[b-qbdrqafo4a] {
        padding: 0.75rem;
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0));
        min-height: 100vh;
        min-height: 100dvh;
    }

    /* Sticky header on mobile */
    .page-header[b-qbdrqafo4a] {
        position: sticky;
        top: 0;
        z-index: 100;
        flex-direction: column;
        align-items: stretch;
        padding: 0.875rem 1rem;
        margin: -0.75rem -0.75rem 1rem;
        border-radius: 0;
        background: white;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    .header-title-row[b-qbdrqafo4a] {
        justify-content: space-between;
    }

    .header-left h1[b-qbdrqafo4a] {
        font-size: 1.35rem;
    }

    .header-subtitle[b-qbdrqafo4a] {
        display: none;
    }

    /* Hide help button on mobile */
    .info-btn[b-qbdrqafo4a] {
        display: none;
    }

    .header-actions[b-qbdrqafo4a] {
        margin-top: 0.75rem;
    }

    .add-job-btn[b-qbdrqafo4a] {
        width: 100%;
        min-height: 44px !important;
    }

    /* Compact stats row */
    .stats-row[b-qbdrqafo4a] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.5rem;
        margin-bottom: 0.75rem;
    }

    .stat-card[b-qbdrqafo4a] {
        padding: 0.75rem;
        border-radius: 10px;
        gap: 0.625rem;
    }

    .stat-card:hover[b-qbdrqafo4a] {
        transform: none;
    }

    .stat-icon[b-qbdrqafo4a] {
        width: 40px;
        height: 40px;
        border-radius: 10px;
    }

    .stat-icon[b-qbdrqafo4a]  .rz-icon {
        font-size: 20px;
    }

    .stat-value[b-qbdrqafo4a] {
        font-size: 1.25rem;
    }

    .stat-label[b-qbdrqafo4a] {
        font-size: 0.7rem;
    }

    /* Filters bar */
    .filters-bar[b-qbdrqafo4a] {
        flex-direction: column;
        align-items: stretch;
        padding: 0.875rem;
        gap: 0.625rem;
        border-radius: 10px;
        margin-bottom: 0.75rem;
    }

    .filters-left[b-qbdrqafo4a] {
        flex-direction: column;
        width: 100%;
        gap: 0.5rem;
    }

    .status-filter[b-qbdrqafo4a] {
        width: 100%;
        min-width: unset;
    }

    .status-filter[b-qbdrqafo4a]  .rz-dropdown {
        width: 100% !important;
        min-height: 44px;
    }

    .search-wrapper[b-qbdrqafo4a] {
        width: 100%;
    }

    .search-input[b-qbdrqafo4a]  .rz-textbox {
        width: 100%;
        min-width: unset;
        min-height: 44px;
    }

    .filters-right[b-qbdrqafo4a] {
        justify-content: center;
    }

    /* Loading & Empty states */
    .loading-container[b-qbdrqafo4a] {
        padding: 3rem 1.5rem;
        border-radius: 10px;
    }

    .empty-state[b-qbdrqafo4a] {
        padding: 3rem 1.5rem;
        border-radius: 10px;
    }

    .desktop-view[b-qbdrqafo4a] {
        display: none;
    }

    .mobile-view[b-qbdrqafo4a] {
        display: block;
    }

    /* ===== MOBILE JOB CARDS ===== */
    .job-card[b-qbdrqafo4a] {
        padding: 1rem;
        border-radius: 12px;
        margin-bottom: 0.625rem;
        -webkit-tap-highlight-color: rgba(0, 79, 60, 0.1);
    }

    .job-card:hover[b-qbdrqafo4a] {
        transform: none;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .job-card:active[b-qbdrqafo4a] {
        transform: scale(0.98);
        background: var(--rz-base-50);
    }

    .job-card-header[b-qbdrqafo4a] {
        margin-bottom: 0.625rem;
        gap: 0.5rem;
    }

    .job-card-title[b-qbdrqafo4a] {
        font-size: 1rem;
        line-height: 1.3;
    }

    .job-card-meta[b-qbdrqafo4a] {
        gap: 0.625rem;
        margin-bottom: 0.75rem;
        font-size: 0.8rem;
    }

    .job-card-meta span[b-qbdrqafo4a] {
        gap: 0.25rem;
    }

    .job-card-meta[b-qbdrqafo4a]  .rz-icon {
        font-size: 14px;
    }

    .job-card-stats[b-qbdrqafo4a] {
        gap: 0;
        padding-top: 0.75rem;
        justify-content: space-around;
    }

    .job-card-stats .stat[b-qbdrqafo4a] {
        flex: 1;
    }

    .job-card-stats .stat-value[b-qbdrqafo4a] {
        font-size: 1.25rem;
    }

    .job-card-stats .stat-label[b-qbdrqafo4a] {
        font-size: 0.65rem;
    }

    /* Mobile action buttons - full touch targets */
    .job-card-actions[b-qbdrqafo4a] {
        gap: 0.5rem;
        padding-top: 0.75rem;
        margin-top: 0.75rem;
    }

    .job-card-actions[b-qbdrqafo4a]  .rz-button {
        flex: 1;
        min-height: 44px !important;
        border-radius: 8px !important;
        font-weight: 500 !important;
        font-size: 0.85rem !important;
    }

    .job-card-actions[b-qbdrqafo4a]  .rz-button .rz-button-text {
        font-size: 0.85rem;
    }

    .job-card-actions[b-qbdrqafo4a]  .rz-button .rz-icon {
        font-size: 1.125rem;
    }
}

/* Extra small screens (iPhone SE, etc.) */
@media (max-width: 375px) {
    .jobs-page[b-qbdrqafo4a] {
        padding: 0.5rem;
    }

    .page-header[b-qbdrqafo4a] {
        padding: 0.75rem;
        margin: -0.5rem -0.5rem 0.75rem;
    }

    .header-left h1[b-qbdrqafo4a] {
        font-size: 1.2rem;
    }

    .stats-row[b-qbdrqafo4a] {
        gap: 0.375rem;
    }

    .stat-card[b-qbdrqafo4a] {
        padding: 0.625rem;
    }

    .stat-icon[b-qbdrqafo4a] {
        width: 36px;
        height: 36px;
    }

    .stat-icon[b-qbdrqafo4a]  .rz-icon {
        font-size: 18px;
    }

    .stat-value[b-qbdrqafo4a] {
        font-size: 1.1rem;
    }

    .job-card[b-qbdrqafo4a] {
        padding: 0.875rem;
    }

    .job-card-title[b-qbdrqafo4a] {
        font-size: 0.95rem;
    }

    .job-card-stats .stat-value[b-qbdrqafo4a] {
        font-size: 1.1rem;
    }

    .job-card-actions[b-qbdrqafo4a]  .rz-button {
        font-size: 0.8rem !important;
        padding: 0.5rem !important;
    }

    .job-card-actions[b-qbdrqafo4a]  .rz-button .rz-button-text {
        font-size: 0.8rem;
    }
}

/* Landscape mode adjustments */
@media (max-width: 768px) and (orientation: landscape) {
    .stats-row[b-qbdrqafo4a] {
        grid-template-columns: repeat(4, 1fr);
    }

    .stat-card[b-qbdrqafo4a] {
        flex-direction: row;
        text-align: left;
    }
}
/* /Components/Pages/Talent/Pipeline.razor.rz.scp.css */
/* ========================================================================= */
/* PIPELINE KANBAN - MODERN DESIGN SYSTEM                                   */
/* All styles self-contained - no external dependencies                     */
/* ========================================================================= */

/* Keyframe Animations */
@keyframes cardEnter-b-tza4d3qell {
    0% { opacity: 0; transform: translateY(10px) scale(0.98); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes skeletonShimmer-b-tza4d3qell {
    0% { background-position: -200px 0; }
    100% { background-position: calc(200px + 100%) 0; }
}

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

@keyframes slideIn-b-tza4d3qell {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

/* ========================================================================= */
/* PAGE CONTAINER                                                            */
/* ========================================================================= */

.pipeline-page[b-tza4d3qell] {
    height: calc(100vh - 60px);
    display: flex;
    flex-direction: column;
    background: var(--rz-base-100);
    overflow: hidden;
}

/* ========================================================================= */
/* HEADER                                                                    */
/* ========================================================================= */

.page-header[b-tza4d3qell] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: white;
    border-bottom: 1px solid var(--rz-base-200);
    flex-shrink: 0;
}

.header-left[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.header-left h1[b-tza4d3qell] {
    font-size: 1.5rem;
    margin: 0;
}

.pipeline-stats[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.pipeline-stats .search-input[b-tza4d3qell]  .rz-textbox {
    min-width: 180px;
    border-radius: 8px;
}

.stat-item[b-tza4d3qell] {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
}

.stat-value[b-tza4d3qell] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rz-primary);
}

.stat-label[b-tza4d3qell] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.stat-divider[b-tza4d3qell] {
    color: var(--rz-base-300);
}

.stat-item.job-name[b-tza4d3qell] {
    font-weight: 500;
    color: var(--rz-text-color);
}

.header-right[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.filter-group[b-tza4d3qell] {
    display: flex;
    gap: 0.75rem;
}

.job-filter[b-tza4d3qell] {
    min-width: 320px;
}

.search-input[b-tza4d3qell]  .rz-textbox {
    min-width: 200px;
    border-radius: 12px;
}

.toggle-group[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.toggle-label[b-tza4d3qell] {
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
    cursor: pointer;
}

.filter-active[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--rz-primary);
    font-weight: 500;
}

.filter-active-btn[b-tza4d3qell] {
    background: var(--rz-primary-lighter) !important;
    color: var(--rz-primary) !important;
}

/* ========================================================================= */
/* ADVANCED FILTERS PANEL                                                    */
/* ========================================================================= */

.advanced-filters-panel[b-tza4d3qell] {
    background: white;
    border-bottom: 1px solid var(--rz-base-200);
    padding: 1rem 1.5rem;
    animation: slideDown-b-tza4d3qell 0.2s ease-out;
}

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

.filters-grid[b-tza4d3qell] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.filter-item[b-tza4d3qell] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.filter-item label[b-tza4d3qell] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rz-text-secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.filters-actions[b-tza4d3qell] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    padding-top: 0.75rem;
    border-top: 1px solid var(--rz-base-100);
}

/* Mobile-only helper class */
.mobile-only[b-tza4d3qell] {
    display: none;
}

/* Hide on mobile helper class */
.hide-on-mobile[b-tza4d3qell] {
    /* visible by default on desktop */
}

/* Desktop only helper class */
.desktop-only[b-tza4d3qell] {
    /* visible by default on desktop */
}

/* Filters header (hidden on desktop) */
.filters-header[b-tza4d3qell] {
    display: none;
}

/* Mobile filters panel */
@media (max-width: 768px) {
    .mobile-only[b-tza4d3qell] {
        display: block;
    }

    .filters-header[b-tza4d3qell] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1rem;
        border-bottom: 1px solid var(--rz-base-200);
        background: white;
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .filters-header h3[b-tza4d3qell] {
        margin: 0;
        font-size: 1.1rem;
        font-weight: 600;
    }

    .advanced-filters-panel[b-tza4d3qell] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 200;
        padding: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        display: flex;
        flex-direction: column;
        animation: slideUp-b-tza4d3qell 0.25s ease-out;
    }

    @keyframes slideUp-b-tza4d3qell {
        from { transform: translateY(100%); }
        to { transform: translateY(0); }
    }

    .filters-grid[b-tza4d3qell] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
        padding: 1rem;
        flex: 1;
        margin-bottom: 0;
    }

    .filter-item[b-tza4d3qell] {
        gap: 0.5rem;
    }

    .filter-item label[b-tza4d3qell] {
        font-size: 0.8rem;
    }

    .filter-item[b-tza4d3qell]  .rz-dropdown,
    .filter-item[b-tza4d3qell]  .rz-datepicker {
        width: 100% !important;
    }

    .filter-item[b-tza4d3qell]  .rz-dropdown .rz-dropdown-trigger,
    .filter-item[b-tza4d3qell]  .rz-textbox {
        min-height: 44px;
    }

    .filters-actions[b-tza4d3qell] {
        position: sticky;
        bottom: 0;
        background: white;
        padding: 1rem;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0));
        border-top: 1px solid var(--rz-base-200);
        box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
        justify-content: stretch;
        gap: 0.5rem;
    }

    .filters-actions[b-tza4d3qell]  .rz-button {
        flex: 1;
        min-height: 44px;
    }
}

/* ========================================================================= */
/* LOADING                                                                   */
/* ========================================================================= */

.loading-container[b-tza4d3qell] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 1rem;
}

/* ========================================================================= */
/* KANBAN BOARD                                                              */
/* ========================================================================= */

.kanban-board[b-tza4d3qell] {
    display: flex;
    gap: 1rem;
    padding: 1rem 1.5rem;
    overflow-x: auto;
    flex: 1;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}

/* ========================================================================= */
/* KANBAN COLUMN                                                             */
/* ========================================================================= */

.kanban-column[b-tza4d3qell] {
    min-width: 300px;
    max-width: 340px;
    flex-shrink: 0;
    background: white;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    max-height: 100%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

/* Collapsed Column State */
.kanban-column.collapsed[b-tza4d3qell] {
    min-width: 56px;
    max-width: 56px;
}

.kanban-column.collapsed .header-content[b-tza4d3qell] {
    flex-direction: column;
    padding: 1rem 0.5rem;
    gap: 0.5rem;
}

.kanban-column.collapsed .header-info[b-tza4d3qell] {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    gap: 0.5rem;
    flex: 1;
}

.kanban-column.collapsed .stage-name[b-tza4d3qell] {
    font-size: 0.8rem;
}

.kanban-column.collapsed .stage-count[b-tza4d3qell] {
    display: none;
}

.kanban-column.collapsed .header-actions[b-tza4d3qell] {
    display: none;
}

.kanban-column.collapsed .collapsed-info[b-tza4d3qell] {
    display: flex;
    justify-content: center;
    padding-bottom: 0.5rem;
}

.collapsed-info[b-tza4d3qell] {
    display: none;
}

.collapsed-count[b-tza4d3qell] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rz-primary);
}

/* Terminal columns */
.kanban-column.terminal[b-tza4d3qell] {
    opacity: 0.9;
}

/* Drop target state */
.kanban-column.drop-target[b-tza4d3qell] {
    box-shadow: 0 0 0 3px var(--rz-primary-lighter), 0 4px 12px rgba(0, 0, 0, 0.12);
    transform: scale(1.01);
}

.kanban-column.drop-target .column-content[b-tza4d3qell] {
    background: var(--rz-primary-lighter);
}

/* ========================================================================= */
/* COLUMN HEADER                                                             */
/* ========================================================================= */

.column-header[b-tza4d3qell] {
    cursor: pointer;
    user-select: none;
    transition: background 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
}

.column-header:hover[b-tza4d3qell] {
    background: var(--rz-base-50);
}

.column-header:focus-visible[b-tza4d3qell] {
    outline: 2px solid var(--rz-primary);
    outline-offset: -2px;
}

.header-content[b-tza4d3qell] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-radius: 12px 12px 0 0;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--stage-color, var(--rz-primary)) 8%, white) 0%,
        white 100%
    );
    border-top: 4px solid var(--stage-color, var(--rz-primary));
}

.header-info[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.stage-indicator[b-tza4d3qell] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--stage-color, var(--rz-primary));
    flex-shrink: 0;
}

.stage-name[b-tza4d3qell] {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--rz-text-color);
}

.stage-count[b-tza4d3qell] {
    background: var(--rz-base-200);
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rz-text-secondary-color);
    min-width: 24px;
    text-align: center;
}

.header-actions[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.terminal-icon[b-tza4d3qell] {
    font-size: 1.25rem;
    opacity: 0.6;
}

.collapse-icon[b-tza4d3qell] {
    font-size: 1.25rem;
    color: var(--rz-text-secondary-color);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ========================================================================= */
/* COLUMN CONTENT                                                            */
/* ========================================================================= */

.column-content[b-tza4d3qell] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 150px;
    transition: background 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ========================================================================= */
/* KANBAN CARDS                                                              */
/* ========================================================================= */

.kanban-card[b-tza4d3qell] {
    background: white;
    border-radius: 10px;
    padding: 0.875rem;
    padding-left: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid var(--rz-base-200);
    position: relative;
    animation: cardEnter-b-tza4d3qell 0.3s ease-out backwards;
}

/* Stage color left border */
.stage-color-bar[b-tza4d3qell] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--stage-color, var(--rz-primary));
    border-radius: 10px 0 0 10px;
}

.kanban-card:hover[b-tza4d3qell] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
    border-color: var(--rz-primary-lighter);
}

.kanban-card:focus-visible[b-tza4d3qell] {
    outline: 2px solid var(--rz-primary);
    outline-offset: 2px;
}

/* Urgency States */
.kanban-card.warning[b-tza4d3qell] {
    background: linear-gradient(90deg,
        #fef3c7 0%,
        white 15%
    );
}

.kanban-card.danger[b-tza4d3qell] {
    background: linear-gradient(90deg,
        #fee2e2 0%,
        white 15%
    );
}

/* Dragging State */
.kanban-card.dragging[b-tza4d3qell] {
    opacity: 0.5;
    transform: rotate(2deg) scale(1.02);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

.kanban-card[draggable="true"][b-tza4d3qell] {
    cursor: grab;
}

.kanban-card[draggable="true"]:active[b-tza4d3qell] {
    cursor: grabbing;
}

/* ========================================================================= */
/* CARD TOP SECTION                                                          */
/* ========================================================================= */

.card-top[b-tza4d3qell] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.candidate-avatar[b-tza4d3qell] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: 0.875rem;
    flex-shrink: 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.candidate-main[b-tza4d3qell] {
    flex: 1;
    min-width: 0;
}

.candidate-name[b-tza4d3qell] {
    display: block;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--rz-text-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    transition: color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.candidate-name:hover[b-tza4d3qell] {
    color: var(--rz-primary);
}

.candidate-title[b-tza4d3qell] {
    display: block;
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 0.125rem;
}

.card-indicators[b-tza4d3qell] {
    display: flex;
    gap: 0.25rem;
}

.indicator[b-tza4d3qell] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.indicator[b-tza4d3qell]  .rz-icon {
    font-size: 1rem;
}

.indicator.ai-badge[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.5rem;
    border-radius: 999px;
    width: auto;
    height: auto;
    font-weight: 600;
    transition: all 0.2s ease;
}

.indicator.ai-badge .ai-score[b-tza4d3qell] {
    font-size: 0.7rem;
    line-height: 1;
}

/* Score color variants for AI badge */
.indicator.ai-badge.excellent[b-tza4d3qell] {
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%);
    color: #166534;
    border: 1px solid #86efac;
}

.indicator.ai-badge.excellent[b-tza4d3qell]  .rz-icon {
    font-size: 0.8rem;
    color: #22c55e;
}

.indicator.ai-badge.excellent:hover[b-tza4d3qell] {
    background: linear-gradient(135deg, #bbf7d0 0%, #86efac 100%);
}

.indicator.ai-badge.good[b-tza4d3qell] {
    background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%);
    color: #075985;
    border: 1px solid #7dd3fc;
}

.indicator.ai-badge.good[b-tza4d3qell]  .rz-icon {
    font-size: 0.8rem;
    color: #0ea5e9;
}

.indicator.ai-badge.good:hover[b-tza4d3qell] {
    background: linear-gradient(135deg, #bae6fd 0%, #7dd3fc 100%);
}

.indicator.ai-badge.fair[b-tza4d3qell] {
    background: linear-gradient(135deg, #fef9c3 0%, #fde047 100%);
    color: #854d0e;
    border: 1px solid #facc15;
}

.indicator.ai-badge.fair[b-tza4d3qell]  .rz-icon {
    font-size: 0.8rem;
    color: #eab308;
}

.indicator.ai-badge.fair:hover[b-tza4d3qell] {
    background: linear-gradient(135deg, #fde047 0%, #facc15 100%);
}

.indicator.ai-badge.poor[b-tza4d3qell] {
    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.indicator.ai-badge.poor[b-tza4d3qell]  .rz-icon {
    font-size: 0.8rem;
    color: #ef4444;
}

.indicator.ai-badge.poor:hover[b-tza4d3qell] {
    background: linear-gradient(135deg, #fecaca 0%, #fca5a5 100%);
}

/* ========================================================================= */
/* COMPANY                                                                   */
/* ========================================================================= */

.candidate-company[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
    margin-bottom: 0.75rem;
    padding-left: 0.25rem;
}

.candidate-company[b-tza4d3qell]  .rz-icon {
    font-size: 0.85rem;
    opacity: 0.7;
}

/* ========================================================================= */
/* VOTE PROGRESS BAR                                                         */
/* ========================================================================= */

.vote-progress[b-tza4d3qell] {
    margin-bottom: 0.75rem;
}

.vote-bar[b-tza4d3qell] {
    display: flex;
    height: 6px;
    border-radius: 3px;
    overflow: hidden;
    background: var(--rz-base-200);
}

.vote-segment[b-tza4d3qell] {
    height: 100%;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.vote-segment.yes[b-tza4d3qell] {
    background: #22c55e;
}

.vote-segment.no[b-tza4d3qell] {
    background: #ef4444;
}

.vote-labels[b-tza4d3qell] {
    display: flex;
    justify-content: space-between;
    font-size: 0.65rem;
    font-weight: 600;
    margin-top: 0.25rem;
}

.vote-yes[b-tza4d3qell] {
    color: #22c55e;
}

.vote-no[b-tza4d3qell] {
    color: #ef4444;
}

/* ========================================================================= */
/* CARD FOOTER - Days + Actions on same row                                  */
/* ========================================================================= */

.card-footer[b-tza4d3qell] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding-top: 0.5rem;
    margin-top: 0.5rem;
    border-top: 1px solid var(--rz-base-100);
}

/* ========================================================================= */
/* TAGS                                                                      */
/* ========================================================================= */

.card-tags[b-tza4d3qell] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.tag[b-tza4d3qell] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.65rem;
    font-weight: 500;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    background: var(--rz-base-100);
    color: var(--rz-text-secondary-color);
}

.tag-icon[b-tza4d3qell] {
    font-size: 0.7rem !important;
    opacity: 0.7;
}

.tag.days.warning[b-tza4d3qell] {
    background: #fef3c7;
    color: #92400e;
}

.tag.days.danger[b-tza4d3qell] {
    background: #fee2e2;
    color: #991b1b;
}

/* ========================================================================= */
/* JOB TITLE (Full Width)                                                    */
/* ========================================================================= */

.card-job-title[b-tza4d3qell] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    background: linear-gradient(135deg, var(--rz-primary-lighter) 0%, #e0f2fe 100%);
    border-radius: 6px;
    margin-bottom: 0.5rem;
    border-left: 3px solid var(--rz-primary);
}

.card-job-title .job-icon[b-tza4d3qell] {
    font-size: 0.875rem;
    color: var(--rz-primary);
    flex-shrink: 0;
    margin-top: 1px;
}

.card-job-title .job-text[b-tza4d3qell] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rz-primary-dark, #0369a1);
    line-height: 1.3;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* ========================================================================= */
/* QUICK ACTIONS - ALWAYS VISIBLE                                            */
/* ========================================================================= */

.quick-actions[b-tza4d3qell] {
    display: flex;
    gap: 0.25rem;
    justify-content: flex-end;
    opacity: 0.6;
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.kanban-card:hover .quick-actions[b-tza4d3qell],
.kanban-card:focus-within .quick-actions[b-tza4d3qell] {
    opacity: 1;
}

.quick-actions[b-tza4d3qell]  .rz-button {
    padding: 0.35rem;
    min-width: 32px;
    border-radius: 6px;
}

.quick-actions[b-tza4d3qell]  .rz-icon {
    font-size: 1rem;
}

.quick-actions[b-tza4d3qell]  .rz-button:hover {
    background: var(--rz-primary-lighter);
    color: var(--rz-primary);
}

/* ========================================================================= */
/* EMPTY COLUMN STATE                                                        */
/* ========================================================================= */

.empty-column[b-tza4d3qell] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1rem;
    color: var(--rz-text-disabled-color);
    text-align: center;
    background: linear-gradient(180deg, var(--rz-base-50) 0%, transparent 100%);
    border-radius: 10px;
    border: 2px dashed var(--rz-base-300);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.kanban-column.drop-target .empty-column[b-tza4d3qell] {
    border-color: var(--rz-primary);
    background: var(--rz-primary-lighter);
}

.empty-icon-wrapper[b-tza4d3qell] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--rz-base-100);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.75rem;
}

.empty-column[b-tza4d3qell]  .rz-icon {
    font-size: 1.75rem;
    opacity: 0.5;
}

.empty-column p[b-tza4d3qell] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
}

.empty-hint[b-tza4d3qell] {
    font-size: 0.75rem;
    margin-top: 0.25rem;
    opacity: 0.7;
}

/* ========================================================================= */
/* MOBILE VIEW                                                               */
/* ========================================================================= */

.mobile-view[b-tza4d3qell] {
    display: none;
    flex: 1;
    overflow: hidden;
    flex-direction: column;
    min-height: 0; /* Critical for flex children to shrink */
}

/* Mobile Tabs Styling */
.mobile-view[b-tza4d3qell]  .rz-tabview {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0; /* Critical for flex children to shrink */
}

.mobile-view[b-tza4d3qell]  .rz-tabview-nav {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0 0.5rem;
    background: white;
    border-bottom: 1px solid var(--rz-base-200);
    gap: 0;
    flex-shrink: 0;
}

.mobile-view[b-tza4d3qell]  .rz-tabview-nav::-webkit-scrollbar {
    display: none;
}

.mobile-view[b-tza4d3qell]  .rz-tabview-nav li {
    flex-shrink: 0;
}

.mobile-view[b-tza4d3qell]  .rz-tabview-nav .rz-tabview-nav-link {
    padding: 0.75rem 1rem;
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    transition: all 0.2s ease;
}

.mobile-view[b-tza4d3qell]  .rz-tabview-nav .rz-tabview-nav-link.rz-tabview-selected {
    color: var(--rz-primary);
    border-bottom-color: var(--rz-primary);
    background: var(--rz-primary-lighter);
}

.mobile-view[b-tza4d3qell]  .rz-tabview-panels {
    flex: 1;
    overflow: hidden;
    min-height: 0; /* Critical for flex children to shrink */
}

.mobile-view[b-tza4d3qell]  .rz-tabview-panel {
    height: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.mobile-stage-list[b-tza4d3qell] {
    padding: 0.75rem;
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    flex: 1;
    min-height: 0; /* Critical for flex overflow scrolling */
}

.mobile-card[b-tza4d3qell] {
    background: white;
    border-radius: 12px;
    padding: 1rem;
    padding-left: 1.125rem;
    margin-bottom: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid var(--rz-base-200);
    /* Ensure tap highlight is visible */
    -webkit-tap-highlight-color: rgba(0, 79, 60, 0.1);
}

.mobile-card[b-tza4d3qell]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--stage-color, var(--rz-primary));
    border-radius: 12px 0 0 12px;
}

.mobile-card:active[b-tza4d3qell] {
    transform: scale(0.98);
    background: var(--rz-base-50);
}

/* Urgency states for mobile cards */
.mobile-card.warning[b-tza4d3qell] {
    background: linear-gradient(90deg, #fef3c7 0%, white 20%);
}

.mobile-card.danger[b-tza4d3qell] {
    background: linear-gradient(90deg, #fee2e2 0%, white 20%);
}

.mobile-card-header[b-tza4d3qell] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.mobile-card-header .candidate-avatar[b-tza4d3qell] {
    width: 48px;
    height: 48px;
    font-size: 1rem;
}

.mobile-card-header .candidate-info[b-tza4d3qell] {
    flex: 1;
    min-width: 0;
}

.mobile-card-header .name[b-tza4d3qell] {
    display: block;
    font-weight: 600;
    font-size: 1rem;
    color: var(--rz-text-color);
}

.mobile-card-header .title[b-tza4d3qell] {
    display: block;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
    margin-top: 0.125rem;
}

.mobile-card-header .company[b-tza4d3qell] {
    display: block;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.mobile-indicators[b-tza4d3qell] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.mobile-ai-badge[b-tza4d3qell] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
}

.mobile-ai-badge[b-tza4d3qell]  .rz-icon {
    font-size: 0.85rem;
}

/* Mobile badge color variants */
.mobile-ai-badge.excellent[b-tza4d3qell] {
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%);
    color: #166534;
    border: 1px solid #86efac;
}

.mobile-ai-badge.excellent[b-tza4d3qell]  .rz-icon {
    color: #22c55e;
}

.mobile-ai-badge.good[b-tza4d3qell] {
    background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%);
    color: #075985;
    border: 1px solid #7dd3fc;
}

.mobile-ai-badge.good[b-tza4d3qell]  .rz-icon {
    color: #0ea5e9;
}

.mobile-ai-badge.fair[b-tza4d3qell] {
    background: linear-gradient(135deg, #fef9c3 0%, #fde047 100%);
    color: #854d0e;
    border: 1px solid #facc15;
}

.mobile-ai-badge.fair[b-tza4d3qell]  .rz-icon {
    color: #eab308;
}

.mobile-ai-badge.poor[b-tza4d3qell] {
    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.mobile-ai-badge.poor[b-tza4d3qell]  .rz-icon {
    color: #ef4444;
}

.mobile-card-meta[b-tza4d3qell] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--rz-base-200);
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.mobile-card-meta .days.warning[b-tza4d3qell] {
    color: #92400e;
}

.mobile-card-meta .days.danger[b-tza4d3qell] {
    color: #991b1b;
}

.mobile-card-meta .votes .yes[b-tza4d3qell] {
    color: #22c55e;
}

.mobile-card-meta .votes .no[b-tza4d3qell] {
    color: #ef4444;
}

.mobile-job-tag[b-tza4d3qell] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.35rem 0.625rem;
    background: linear-gradient(135deg, var(--rz-primary-lighter) 0%, #e0f2fe 100%);
    color: var(--rz-primary);
    border-radius: 6px;
    border-left: 3px solid var(--rz-primary);
}

.mobile-actions[b-tza4d3qell] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--rz-base-200);
}

.mobile-actions[b-tza4d3qell]  .rz-button {
    flex: 1;
    min-height: 44px; /* iOS minimum touch target */
    border-radius: 8px;
    font-weight: 500;
}

/* Make icon-only buttons square on mobile */
.mobile-actions[b-tza4d3qell]  .rz-button:not(:has(.rz-button-text)) {
    flex: 0;
    min-width: 44px;
    padding: 0.5rem;
}

.mobile-actions[b-tza4d3qell]  .rz-button .rz-icon {
    font-size: 1.25rem;
}

.empty-stage[b-tza4d3qell] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    color: var(--rz-text-disabled-color);
    text-align: center;
}

.empty-stage[b-tza4d3qell]  .rz-icon {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
    opacity: 0.5;
}

.empty-stage p[b-tza4d3qell] {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 500;
}

.empty-stage .empty-hint[b-tza4d3qell] {
    font-size: 0.8rem;
    margin-top: 0.25rem;
    opacity: 0.7;
}

/* ========================================================================= */
/* PREVIEW PANEL                                                             */
/* ========================================================================= */

.preview-overlay[b-tza4d3qell] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    justify-content: flex-end;
    z-index: 1000;
    animation: fadeIn-b-tza4d3qell 0.2s ease-out;
}

.preview-panel[b-tza4d3qell] {
    width: 400px;
    max-width: 100%;
    background: white;
    height: 100%;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    animation: slideIn-b-tza4d3qell 0.3s ease-out;
}

.preview-header[b-tza4d3qell] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.preview-header h3[b-tza4d3qell] {
    margin: 0;
    font-size: 1.1rem;
}

.preview-content[b-tza4d3qell] {
    flex: 1;
    padding: 1.25rem;
    overflow-y: auto;
}

.preview-title[b-tza4d3qell] {
    font-size: 1rem;
    font-weight: 500;
    margin: 0 0 0.25rem;
}

.preview-company[b-tza4d3qell] {
    color: var(--rz-text-secondary-color);
    margin: 0 0 1.5rem;
}

.preview-stats[b-tza4d3qell] {
    display: flex;
    gap: 1rem;
}

.preview-stats .stat[b-tza4d3qell] {
    flex: 1;
    text-align: center;
    padding: 1rem;
    background: var(--rz-base-50);
    border-radius: 8px;
}

.preview-stats .value[b-tza4d3qell] {
    display: block;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--rz-primary);
}

.preview-stats .label[b-tza4d3qell] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.preview-actions[b-tza4d3qell] {
    padding: 1.25rem;
    border-top: 1px solid var(--rz-base-200);
}

.full-width[b-tza4d3qell] {
    width: 100%;
}

/* ========================================================================= */
/* RESPONSIVE DESIGN                                                         */
/* ========================================================================= */

@media (max-width: 768px) {
    .pipeline-page[b-tza4d3qell] {
        height: 100vh;
        height: 100dvh; /* Dynamic viewport height for PWA */
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    /* Override global Radzen button min dimensions for this page */
    .pipeline-page[b-tza4d3qell]  .rz-button {
        min-width: unset;
        min-height: unset;
    }

    /* Hide elements marked for mobile hiding */
    .hide-on-mobile[b-tza4d3qell],
    .desktop-only[b-tza4d3qell] {
        display: none !important;
    }

    /* Show mobile-only elements */
    .mobile-only[b-tza4d3qell] {
        display: block !important;
    }

    /* Compact sticky header for mobile - cleaner layout */
    .page-header[b-tza4d3qell] {
        position: sticky;
        top: 0;
        z-index: 100;
        flex-direction: column;
        align-items: stretch;
        padding: 0.75rem 1rem;
        gap: 0.5rem;
        background: white;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    /* Title row: Pipeline title + candidate count */
    .header-left[b-tza4d3qell] {
        flex-direction: row;
        align-items: center;
        gap: 0.75rem;
    }

    .header-left h1[b-tza4d3qell] {
        font-size: 1.25rem;
        flex-shrink: 0;
    }

    /* Stats inline with title */
    .pipeline-stats[b-tza4d3qell] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        flex-wrap: nowrap;
    }

    .pipeline-stats .stat-value[b-tza4d3qell] {
        font-size: 1rem;
    }

    .pipeline-stats .stat-label[b-tza4d3qell] {
        font-size: 0.7rem;
    }

    /* Hide job name and dividers in stats on mobile */
    .pipeline-stats .stat-item.job-name[b-tza4d3qell],
    .pipeline-stats .stat-divider[b-tza4d3qell] {
        display: none;
    }

    /* Filter controls row - single row with matched heights */
    .header-right[b-tza4d3qell] {
        display: contents;
    }

    .filter-group[b-tza4d3qell] {
        display: flex;
        flex-direction: row;
        gap: 0.5rem;
        width: 100%;
        align-items: center;
    }

    .job-filter[b-tza4d3qell] {
        flex: 1;
        min-width: 0;
    }

    .job-filter[b-tza4d3qell]  .rz-dropdown {
        width: 100% !important;
    }

    .job-filter[b-tza4d3qell]  .rz-dropdown .rz-helper,
    .job-filter[b-tza4d3qell]  .rz-dropdown .rz-dropdown-trigger {
        height: 40px;
        min-height: 40px;
    }

    /* Filter button - match dropdown height exactly */
    .filter-group .filter-btn[b-tza4d3qell] {
        height: 40px !important;
        width: 40px !important;
        min-width: 40px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0;
    }

    /* Mobile search input - full width at bottom of header */
    .header-right .search-input.mobile-only[b-tza4d3qell] {
        width: 100%;
        order: 10; /* Ensure it comes last */
    }

    .header-right .search-input.mobile-only[b-tza4d3qell]  .rz-textbox {
        width: 100%;
        height: 40px;
        border-radius: 8px;
    }

    /* Show kanban board on mobile - horizontally scrollable */
    .desktop-view[b-tza4d3qell] {
        display: flex;
        padding: 0.75rem;
        gap: 0.75rem;
    }

    /* Smaller columns for mobile kanban */
    .desktop-view .kanban-column[b-tza4d3qell] {
        min-width: 260px;
        max-width: 280px;
    }

    .desktop-view .kanban-column.collapsed[b-tza4d3qell] {
        min-width: 48px;
        max-width: 48px;
    }

    /* Hide the tabs-based mobile view - use kanban instead */
    .mobile-view[b-tza4d3qell] {
        display: none;
    }

    .preview-panel[b-tza4d3qell] {
        width: 100%;
        max-width: 100vw;
    }

    /* Help panel mobile */
    .help-panel[b-tza4d3qell] {
        margin: 0 0.5rem;
        padding: 0.75rem;
        font-size: 0.85rem;
    }

    .help-panel ul[b-tza4d3qell] {
        padding-left: 1.25rem;
        margin: 0.5rem 0 0;
    }

    .help-panel li[b-tza4d3qell] {
        margin-bottom: 0.25rem;
    }
}

/* Extra small screens (iPhone SE, etc.) */
@media (max-width: 375px) {
    .page-header[b-tza4d3qell] {
        padding: 0.5rem 0.75rem;
        gap: 0.375rem;
    }

    .header-left h1[b-tza4d3qell] {
        font-size: 1.1rem;
    }

    .pipeline-stats .stat-value[b-tza4d3qell] {
        font-size: 0.9rem;
    }

    .pipeline-stats .stat-label[b-tza4d3qell] {
        font-size: 0.65rem;
    }

    /* Filter controls - slightly smaller on extra small screens */
    .job-filter[b-tza4d3qell]  .rz-dropdown .rz-helper,
    .job-filter[b-tza4d3qell]  .rz-dropdown .rz-dropdown-trigger {
        height: 36px;
        min-height: 36px;
    }

    .filter-group .filter-btn[b-tza4d3qell] {
        height: 36px !important;
        width: 36px !important;
        min-width: 36px !important;
    }

    /* Even smaller columns for extra small screens */
    .desktop-view .kanban-column[b-tza4d3qell] {
        min-width: 240px;
        max-width: 260px;
    }

    .mobile-card[b-tza4d3qell] {
        padding: 0.75rem;
    }

    .mobile-card-header .candidate-avatar[b-tza4d3qell] {
        width: 40px;
        height: 40px;
        font-size: 0.9rem;
    }

    .mobile-card-header .name[b-tza4d3qell] {
        font-size: 0.9rem;
    }
}

/* ========================================================================= */
/* SCROLLBAR STYLING                                                         */
/* ========================================================================= */

.column-content[b-tza4d3qell]::-webkit-scrollbar,
.kanban-board[b-tza4d3qell]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.column-content[b-tza4d3qell]::-webkit-scrollbar-track,
.kanban-board[b-tza4d3qell]::-webkit-scrollbar-track {
    background: transparent;
}

.column-content[b-tza4d3qell]::-webkit-scrollbar-thumb,
.kanban-board[b-tza4d3qell]::-webkit-scrollbar-thumb {
    background: var(--rz-base-300);
    border-radius: 3px;
}

.column-content[b-tza4d3qell]::-webkit-scrollbar-thumb:hover,
.kanban-board[b-tza4d3qell]::-webkit-scrollbar-thumb:hover {
    background: var(--rz-base-400);
}

/* ========================================================================= */
/* ACCESSIBILITY                                                             */
/* ========================================================================= */

@media (prefers-reduced-motion: reduce) {
    .kanban-card[b-tza4d3qell],
    .kanban-column[b-tza4d3qell],
    .column-header[b-tza4d3qell],
    .quick-actions[b-tza4d3qell],
    .vote-segment[b-tza4d3qell],
    .collapse-icon[b-tza4d3qell] {
        transition: none;
        animation: none;
    }
}

@media (prefers-contrast: high) {
    .kanban-card[b-tza4d3qell] {
        border-width: 2px;
    }

    .stage-color-bar[b-tza4d3qell] {
        width: 6px;
    }

    .kanban-column.drop-target[b-tza4d3qell] {
        outline: 3px solid var(--rz-primary);
    }
}

/* ========================================================================= */
/* AI FIT SCORE BADGE                                                        */
/* ========================================================================= */

.fit-score-badge[b-tza4d3qell] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: help;
    margin-bottom: 0.5rem;
}

.fit-score-badge .score-icon[b-tza4d3qell] {
    font-size: 0.85rem !important;
}

.fit-score-badge .score-value[b-tza4d3qell] {
    line-height: 1;
}

/* Score color variants */
.fit-score-badge.excellent[b-tza4d3qell] {
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%);
    color: #166534;
    border: 1px solid #86efac;
}

.fit-score-badge.good[b-tza4d3qell] {
    background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%);
    color: #075985;
    border: 1px solid #7dd3fc;
}

.fit-score-badge.fair[b-tza4d3qell] {
    background: linear-gradient(135deg, #fef9c3 0%, #fde047 100%);
    color: #854d0e;
    border: 1px solid #facc15;
}

.fit-score-badge.poor[b-tza4d3qell] {
    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
    color: #991b1b;
    border: 1px solid #fca5a5;
}
/* /Components/Pages/Talent/Settings.razor.rz.scp.css */
/* Talent Settings Page Styles */
.settings-page[b-qe4bbayv0a] {
    padding: 1.5rem;
    max-width: 1000px;
    margin: 0 auto;
}

/* Page Header - Matches Jobs page */
.page-header[b-qe4bbayv0a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: white;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.header-title-row[b-qe4bbayv0a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-left h1[b-qe4bbayv0a] {
    font-size: 1.75rem;
    margin: 0;
    color: var(--rz-text-color);
}

.header-subtitle[b-qe4bbayv0a] {
    margin: 0.25rem 0 0;
    color: var(--rz-text-secondary-color);
    font-size: 0.9rem;
}

[b-qe4bbayv0a] .info-btn {
    padding: 0.25rem;
    min-width: auto;
}

/* Help Panel Override */
.help-panel[b-qe4bbayv0a] {
    margin: 0 0 1.5rem;
}

/* Empty state for settings */
.empty-state-small[b-qe4bbayv0a] {
    padding: 1.5rem;
    text-align: center;
    background: var(--rz-base-100);
    border-radius: 8px;
    color: var(--rz-text-secondary-color);
}

.empty-state-small p[b-qe4bbayv0a] {
    margin: 0;
    font-size: 0.875rem;
}

/* Settings Section */
.settings-section[b-qe4bbayv0a] {
    padding: 1rem 0;
}

.section-header[b-qe4bbayv0a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-header h3[b-qe4bbayv0a] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

/* Settings List */
.settings-list[b-qe4bbayv0a] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.settings-item[b-qe4bbayv0a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: white;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s ease;
}

.settings-item:hover[b-qe4bbayv0a] {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.item-color[b-qe4bbayv0a] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    flex-shrink: 0;
}

.item-content[b-qe4bbayv0a] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.item-name[b-qe4bbayv0a] {
    font-weight: 500;
    font-size: 0.9375rem;
}

.item-meta[b-qe4bbayv0a] {
    font-size: 0.75rem;
    color: var(--rz-text-secondary-color);
}

.item-actions[b-qe4bbayv0a] {
    flex-shrink: 0;
}

/* Edit Overlay/Dialog */
.edit-overlay[b-qe4bbayv0a] {
    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: 1rem;
}

.edit-dialog[b-qe4bbayv0a] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.edit-dialog h3[b-qe4bbayv0a] {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
}

.form-field[b-qe4bbayv0a] {
    margin-bottom: 1rem;
}

.form-field[b-qe4bbayv0a]  .rz-label {
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
    display: block;
    margin-bottom: 0.25rem;
}

.form-field.checkbox[b-qe4bbayv0a] {
    display: flex;
    align-items: center;
}

.dialog-actions[b-qe4bbayv0a] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--rz-base-200);
}

/* Radzen Tabs Customization */
[b-qe4bbayv0a] .rz-tabview-nav {
    border-bottom: 1px solid var(--rz-base-200);
    gap: 0.5rem;
}

[b-qe4bbayv0a] .rz-tabview-nav-link {
    padding: 0.75rem 1rem;
    font-weight: 500;
    border-radius: 8px 8px 0 0;
}

[b-qe4bbayv0a] .rz-state-active .rz-tabview-nav-link {
    background: var(--rz-primary);
    color: white;
}

[b-qe4bbayv0a] .rz-tabview-panel {
    padding: 0;
}

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

    .page-header[b-qe4bbayv0a] {
        flex-direction: column;
        align-items: stretch;
        padding: 1rem;
        border-radius: 12px;
    }

    .section-header[b-qe4bbayv0a] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .section-header[b-qe4bbayv0a]  .rz-button {
        width: 100%;
    }

    .settings-item[b-qe4bbayv0a] {
        padding: 0.75rem;
    }

    .edit-dialog[b-qe4bbayv0a] {
        padding: 1rem;
        max-height: 90vh;
        overflow-y: auto;
    }

    .dialog-actions[b-qe4bbayv0a] {
        flex-direction: column;
    }

    .dialog-actions[b-qe4bbayv0a]  .rz-button {
        width: 100%;
    }
}

/* AI Scoring / Batch Re-Score Styles */
.section-description[b-qe4bbayv0a] {
    color: var(--rz-text-secondary-color);
    font-size: 0.9rem;
    margin: 0 0 1.5rem 0;
    line-height: 1.5;
}

.rescore-filters[b-qe4bbayv0a] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.filter-row[b-qe4bbayv0a] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.filter-item[b-qe4bbayv0a] {
    flex: 1;
    min-width: 200px;
}

.filter-item[b-qe4bbayv0a]  .rz-label {
    display: block;
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
    margin-bottom: 0.5rem;
}

.rescore-loading[b-qe4bbayv0a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem;
    background: var(--rz-base-100);
    border-radius: 8px;
    color: var(--rz-text-secondary-color);
}

.rescore-summary[b-qe4bbayv0a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
}

.summary-card[b-qe4bbayv0a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.summary-card[b-qe4bbayv0a]  .rz-icon {
    font-size: 1.5rem;
    color: var(--rz-primary);
}

.summary-info[b-qe4bbayv0a] {
    display: flex;
    flex-direction: column;
}

.summary-number[b-qe4bbayv0a] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--rz-text-color);
    line-height: 1;
}

.summary-label[b-qe4bbayv0a] {
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.rescore-progress[b-qe4bbayv0a] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.progress-header[b-qe4bbayv0a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
    font-size: 0.9rem;
}

.progress-count[b-qe4bbayv0a] {
    font-weight: 600;
    color: var(--rz-primary);
}

.current-candidate[b-qe4bbayv0a] {
    display: block;
    margin-top: 0.75rem;
    font-size: 0.8rem;
    color: var(--rz-text-secondary-color);
}

.rescore-results[b-qe4bbayv0a] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.rescore-results h4[b-qe4bbayv0a] {
    font-size: 0.95rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
}

.results-summary[b-qe4bbayv0a] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1rem;
}

.result-success[b-qe4bbayv0a] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    color: #16a34a;
    font-weight: 500;
    font-size: 0.9rem;
}

.result-failed[b-qe4bbayv0a] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    color: #dc2626;
    font-weight: 500;
    font-size: 0.9rem;
}

.failed-list[b-qe4bbayv0a] {
    background: #fef2f2;
    border-radius: 8px;
    padding: 0.75rem;
}

.failed-item[b-qe4bbayv0a] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    font-size: 0.85rem;
    border-bottom: 1px solid #fecaca;
}

.failed-item:last-child[b-qe4bbayv0a] {
    border-bottom: none;
}

.failed-name[b-qe4bbayv0a] {
    font-weight: 500;
    color: #991b1b;
}

.failed-reason[b-qe4bbayv0a] {
    color: #b91c1c;
    font-size: 0.8rem;
}

.more-failures[b-qe4bbayv0a] {
    display: block;
    padding-top: 0.5rem;
    font-size: 0.8rem;
    color: #b91c1c;
}

/* Success list with before/after scores */
.success-list[b-qe4bbayv0a] {
    background: #f0fdf4;
    border-radius: 8px;
    padding: 0.75rem;
    margin-bottom: 1rem;
}

.success-list-header[b-qe4bbayv0a] {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    gap: 1rem;
    padding: 0.5rem 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rz-text-secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-bottom: 1px solid #bbf7d0;
    margin-bottom: 0.25rem;
}

.success-list-header span:not(:first-child)[b-qe4bbayv0a] {
    text-align: center;
    min-width: 55px;
}

.success-item[b-qe4bbayv0a] {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    gap: 1rem;
    padding: 0.5rem 0;
    font-size: 0.85rem;
    border-bottom: 1px solid #dcfce7;
    align-items: center;
}

.success-item:last-child[b-qe4bbayv0a] {
    border-bottom: none;
}

.success-name[b-qe4bbayv0a] {
    font-weight: 500;
    color: #166534;
}

.score-before[b-qe4bbayv0a],
.score-after[b-qe4bbayv0a] {
    text-align: center;
    min-width: 55px;
    font-weight: 500;
}

.score-before[b-qe4bbayv0a] {
    color: var(--rz-text-secondary-color);
}

.score-after[b-qe4bbayv0a] {
    color: #166534;
}

.score-change[b-qe4bbayv0a] {
    text-align: center;
    min-width: 55px;
    font-weight: 600;
    font-size: 0.8rem;
}

.score-change.positive[b-qe4bbayv0a] {
    color: #16a34a;
}

.score-change.negative[b-qe4bbayv0a] {
    color: #dc2626;
}

.score-change.neutral[b-qe4bbayv0a] {
    color: var(--rz-text-disabled-color);
}

.rescore-preview[b-qe4bbayv0a] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.preview-header[b-qe4bbayv0a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.preview-header h4[b-qe4bbayv0a] {
    font-size: 0.95rem;
    font-weight: 600;
    margin: 0;
}

.select-all-controls[b-qe4bbayv0a] {
    display: flex;
    gap: 0.5rem;
}

.preview-list[b-qe4bbayv0a] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 500px;
    overflow-y: auto;
}

.preview-item[b-qe4bbayv0a] {
    display: grid;
    grid-template-columns: auto 1fr 1fr auto auto auto;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    background: var(--rz-base-50);
    border-radius: 6px;
    font-size: 0.85rem;
    align-items: center;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.preview-item:hover[b-qe4bbayv0a] {
    background: var(--rz-base-100);
}

.preview-item.selected[b-qe4bbayv0a] {
    background: rgba(var(--rz-primary-rgb), 0.08);
    border: 1px solid rgba(var(--rz-primary-rgb), 0.2);
}

.preview-checkbox[b-qe4bbayv0a] {
    flex-shrink: 0;
}

.preview-stage[b-qe4bbayv0a] {
    font-size: 0.7rem;
    font-weight: 500;
    color: white;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    white-space: nowrap;
    text-align: center;
    min-width: 70px;
}

.preview-name[b-qe4bbayv0a] {
    font-weight: 500;
    color: var(--rz-text-color);
}

.preview-job[b-qe4bbayv0a] {
    color: var(--rz-text-secondary-color);
}

.preview-score[b-qe4bbayv0a] {
    font-weight: 600;
    color: var(--rz-primary);
    text-align: right;
    min-width: 60px;
}

.preview-score.no-score[b-qe4bbayv0a] {
    color: var(--rz-text-disabled-color);
    font-weight: normal;
    font-size: 0.8rem;
}

.preview-date[b-qe4bbayv0a] {
    font-size: 0.75rem;
    color: var(--rz-text-disabled-color);
    min-width: 50px;
    text-align: right;
}

.preview-more[b-qe4bbayv0a] {
    padding: 0.75rem;
    text-align: center;
    color: var(--rz-text-secondary-color);
    font-size: 0.85rem;
    font-style: italic;
}

@media (max-width: 768px) {
    .filter-row[b-qe4bbayv0a] {
        flex-direction: column;
        gap: 1rem;
    }

    .filter-item[b-qe4bbayv0a] {
        min-width: 100%;
    }

    .rescore-summary[b-qe4bbayv0a] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .rescore-summary[b-qe4bbayv0a]  .rz-button {
        width: 100%;
    }

    .results-summary[b-qe4bbayv0a] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .preview-header[b-qe4bbayv0a] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .select-all-controls[b-qe4bbayv0a] {
        width: 100%;
    }

    .select-all-controls[b-qe4bbayv0a]  .rz-button {
        flex: 1;
    }

    .preview-item[b-qe4bbayv0a] {
        grid-template-columns: auto 1fr auto;
        gap: 0.5rem;
    }

    .preview-job[b-qe4bbayv0a],
    .preview-date[b-qe4bbayv0a] {
        display: none;
    }

    .preview-stage[b-qe4bbayv0a] {
        min-width: auto;
        font-size: 0.65rem;
        padding: 0.15rem 0.4rem;
    }
}
/* /Components/Pages/VoidTracker.razor.rz.scp.css */
/* Void Tracker Dashboard Styles */

.void-tracker-container[b-ohwtxvix8s] {
    padding: 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    min-height: 100vh;
    min-height: 100dvh;
}

/* Page Header */
.page-header[b-ohwtxvix8s] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.header-content h1[b-ohwtxvix8s] {
    margin: 0 0 0.25rem 0;
    color: var(--rz-primary);
    font-size: 1.75rem;
}

.header-content p[b-ohwtxvix8s] {
    margin: 0;
    color: #6b7280;
    font-size: 0.95rem;
}

.refresh-timestamp[b-ohwtxvix8s] {
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 0.25rem;
    display: block;
}

.header-actions[b-ohwtxvix8s] {
    display: flex;
    gap: 0.75rem;
}

.action-btn-primary[b-ohwtxvix8s] {
    background: var(--rz-primary) !important;
}

.action-btn-secondary[b-ohwtxvix8s] {
    border-color: var(--rz-primary) !important;
    color: var(--rz-primary) !important;
}

/* Warning Banner */
.warning-banner[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 1px solid #f59e0b;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 0.75rem;
}

.warning-banner[b-ohwtxvix8s]  .rzi {
    font-size: 1.5rem;
    color: #d97706;
}

.warning-content[b-ohwtxvix8s] {
    flex: 1;
    font-size: 0.9rem;
    color: #92400e;
}

.warning-content strong[b-ohwtxvix8s] {
    color: #78350f;
}

.warning-actions[b-ohwtxvix8s] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dismiss-banner-btn[b-ohwtxvix8s] {
    padding: 0.25rem !important;
    min-width: unset !important;
    border-radius: 50% !important;
}

.dismiss-banner-btn:hover[b-ohwtxvix8s] {
    background: rgba(0, 0, 0, 0.1) !important;
}

/* Info Banner (for verified-only mode) */
.info-banner[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
    border: 1px solid #3b82f6;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 0.75rem;
}

.info-banner[b-ohwtxvix8s]  .rzi {
    font-size: 1.5rem;
    color: #2563eb;
}

.info-banner .warning-content[b-ohwtxvix8s] {
    color: #1e40af;
}

.info-banner .warning-content strong[b-ohwtxvix8s] {
    color: #1e3a8a;
}

/* Filters Section */
.filters-section[b-ohwtxvix8s] {
    background: white;
    border-radius: 12px;
    padding: 0;
    margin-bottom: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.filters-header[b-ohwtxvix8s] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s;
}

.filters-header:hover[b-ohwtxvix8s] {
    background: #f9fafb;
}

.filters-title[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    color: #374151;
}

.filters-title[b-ohwtxvix8s]  .rzi {
    font-size: 1.1rem;
    color: #6b7280;
}

.active-filter-badge[b-ohwtxvix8s] {
    background: var(--rz-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
}

.expand-icon[b-ohwtxvix8s] {
    color: #9ca3af;
    transition: transform 0.2s;
}

.filters-row[b-ohwtxvix8s] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    padding: 0 1.25rem 1rem 1.25rem;
    border-top: 1px solid #f3f4f6;
    padding-top: 1rem;
}

.filter-group[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.filter-group label[b-ohwtxvix8s] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-actions[b-ohwtxvix8s] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

/* KPI Cards Row (Horizontal) */
.kpi-cards-row[b-ohwtxvix8s] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.kpi-cards-row .kpi-card[b-ohwtxvix8s] {
    flex: 1;
    min-width: 0;
}

/* 2x2 Dashboard Grid */
.dashboard-grid[b-ohwtxvix8s] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

/* Trend Chart Cell */
.trend-chart[b-ohwtxvix8s] {
    min-height: 320px;
    display: flex;
    flex-direction: column;
}

.trend-chart-container[b-ohwtxvix8s] {
    flex: 1;
    min-height: 250px;
    height: 250px;
}

.trend-chart .chart-header-with-filter[b-ohwtxvix8s] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.trend-controls[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.trend-controls[b-ohwtxvix8s]  .rz-dropdown {
    font-size: 0.8rem;
}

.chart-loading[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    gap: 0.75rem;
    color: #6b7280;
}

.chart-loading span[b-ohwtxvix8s] {
    font-size: 0.85rem;
}

.no-data-hint[b-ohwtxvix8s] {
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 0.25rem;
    font-style: italic;
}

.grid-cell[b-ohwtxvix8s] {
    min-height: 0;
}

/* KPI Grid Cell - Vertical stack */
.kpi-grid-cell[b-ohwtxvix8s] {
    background: transparent;
    padding: 0;
}

.kpi-cards-vertical[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    height: 100%;
}

/* Legacy horizontal layout (kept for reference, now using vertical) */
.kpi-cards-section[b-ohwtxvix8s] {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.kpi-card[b-ohwtxvix8s] {
    background: white;
    border-radius: 8px;
    padding: 0.6rem 0.9rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.6rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s, box-shadow 0.2s;
    flex: 1 1 auto;
    min-width: 0;
}

/* KPI cards in vertical layout */
.kpi-cards-vertical .kpi-card[b-ohwtxvix8s] {
    flex: 1 1 auto;
}

.kpi-card:hover[b-ohwtxvix8s] {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.kpi-icon[b-ohwtxvix8s] {
    font-size: 1.1rem;
    flex-shrink: 0;
}

.kpi-icon[b-ohwtxvix8s]  .rzi {
    font-size: 1.1rem;
}

/* KPI Card Colors */
.highlight-card[b-ohwtxvix8s] {
    background: linear-gradient(135deg, #dc2626 0%, #ef4444 100%);
    border: 2px solid #dc2626;
}

.highlight-card .kpi-icon[b-ohwtxvix8s],
.highlight-card .kpi-value[b-ohwtxvix8s],
.highlight-card .kpi-label[b-ohwtxvix8s] {
    color: white !important;
}

.highlight-card .kpi-breakdown[b-ohwtxvix8s] {
    border-left-color: rgba(255, 255, 255, 0.3);
}

.highlight-card .breakdown-item[b-ohwtxvix8s] {
    color: rgba(255, 255, 255, 0.9);
}

.rebuy-card .kpi-icon[b-ohwtxvix8s] { color: #f97316; }
.warning-card .kpi-icon[b-ohwtxvix8s] { color: #eab308; }
.stores-card .kpi-icon[b-ohwtxvix8s] { color: #8b5cf6; }
.never-sold-card .kpi-icon[b-ohwtxvix8s] { color: #dc2626; }

.kpi-content[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.kpi-value[b-ohwtxvix8s] {
    font-size: 1.15rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.1;
}

.kpi-label[b-ohwtxvix8s] {
    font-size: 0.65rem;
    color: #6b7280;
    margin-top: 0.1rem;
    white-space: nowrap;
}

/* Week-over-Week Comparison Indicator */
.kpi-wow[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.6rem;
    font-weight: 500;
    margin-top: 0.15rem;
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kpi-wow.wow-positive[b-ohwtxvix8s] {
    background: rgba(34, 197, 94, 0.2);
    color: #166534;
}

.kpi-wow.wow-negative[b-ohwtxvix8s] {
    background: rgba(239, 68, 68, 0.2);
    color: #dc2626;
}

/* Override for highlight card (needs higher contrast) */
.highlight-card .kpi-wow.wow-positive[b-ohwtxvix8s] {
    background: rgba(255, 255, 255, 0.9);
    color: #166534;
}

.highlight-card .kpi-wow.wow-negative[b-ohwtxvix8s] {
    background: rgba(255, 255, 255, 0.9);
    color: #dc2626;
}

.wow-arrow[b-ohwtxvix8s] {
    font-weight: 700;
    font-size: 0.7rem;
}

.wow-label[b-ohwtxvix8s] {
    font-size: 0.55rem;
    opacity: 0.8;
    margin-left: 0.1rem;
}

.kpi-breakdown[b-ohwtxvix8s] {
    display: none;
}

.breakdown-item[b-ohwtxvix8s] {
    font-size: 0.6rem;
    color: #6b7280;
    white-space: nowrap;
}

/* Show breakdown on larger screens */
@media (min-width: 1400px) {
    .kpi-breakdown[b-ohwtxvix8s] {
        display: flex;
        gap: 0.5rem;
        margin-left: auto;
        padding-left: 0.5rem;
        border-left: 1px solid #e5e7eb;
        flex-shrink: 0;
    }
}

/* Charts Section */
.charts-row[b-ohwtxvix8s] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.chart-card[b-ohwtxvix8s] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.chart-card h3[b-ohwtxvix8s] {
    margin: 0 0 0.25rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

/* Scrollable distributor chart */
.distributor-chart-scroll[b-ohwtxvix8s] {
    max-height: 280px;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Custom Chain Bars with Logos */
.chain-bars-container[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 280px;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.chain-bar-row[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.4rem 0.5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s;
}

.chain-bar-row:hover[b-ohwtxvix8s] {
    background: #f3f4f6;
}

.chain-bar-row.selected[b-ohwtxvix8s] {
    background: rgba(0, 79, 60, 0.1);
    outline: 2px solid var(--rz-primary);
}

.chain-bar-label[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 140px;
    flex-shrink: 0;
}

.chain-bar-logo[b-ohwtxvix8s] {
    width: 24px;
    height: 24px;
    object-fit: contain;
    border-radius: 4px;
    flex-shrink: 0;
}

.chain-bar-name[b-ohwtxvix8s] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.chain-bar-track[b-ohwtxvix8s] {
    flex: 1;
    height: 20px;
    background: #f3f4f6;
    border-radius: 4px;
    overflow: hidden;
}

.chain-bar-fill[b-ohwtxvix8s] {
    height: 100%;
    background: linear-gradient(90deg, #f59e0b 0%, #fbbf24 100%);
    border-radius: 4px;
    transition: width 0.3s ease;
}

.chain-bar-row.selected .chain-bar-fill[b-ohwtxvix8s] {
    background: linear-gradient(90deg, var(--rz-primary) 0%, #006B52 100%);
}

.chain-bar-value[b-ohwtxvix8s] {
    min-width: 50px;
    text-align: right;
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
}

.chart-header-with-filter[b-ohwtxvix8s] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.chart-header-with-filter h3[b-ohwtxvix8s] {
    margin: 0;
}

.chart-header-actions[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Toggle Group */
.toggle-group[b-ohwtxvix8s] {
    display: flex;
    background: #f3f4f6;
    border-radius: 6px;
    padding: 2px;
}

.toggle-btn[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.3rem 0.6rem;
    font-size: 0.7rem;
    font-weight: 500;
    color: #6b7280;
    background: transparent;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
}

.toggle-btn:hover[b-ohwtxvix8s] {
    color: #374151;
}

.toggle-btn.active[b-ohwtxvix8s] {
    background: white;
    color: var(--rz-primary);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.toggle-btn[b-ohwtxvix8s]  .rzi {
    font-size: 0.85rem;
}

/* Region badge filter */
.region-badge-filter[b-ohwtxvix8s] {
    background: #6366f1;
}

.chart-filter-badge[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: var(--rz-primary);
    color: white;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.3rem 0.6rem;
    border-radius: 9999px;
    animation: fadeIn-b-ohwtxvix8s 0.2s ease-in-out;
}

.chart-filter-badge[b-ohwtxvix8s]  .rzi {
    font-size: 0.85rem;
}

.chain-badge-filter[b-ohwtxvix8s] {
    background: #f59e0b;
}

.flavor-badge-filter[b-ohwtxvix8s] {
    background: #10b981;
}

.execution-badge-filter[b-ohwtxvix8s] {
    background: #8b5cf6;
}

.vip-badge-filter[b-ohwtxvix8s] {
    background: #22c55e;
}

.clear-filter-x[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.25rem;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.clear-filter-x:hover[b-ohwtxvix8s] {
    opacity: 1;
}

.clear-filter-x[b-ohwtxvix8s]  .rzi {
    font-size: 0.75rem;
}

@keyframes fadeIn-b-ohwtxvix8s {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}

.chart-filtered[b-ohwtxvix8s] {
    border: 2px solid var(--rz-primary);
    box-shadow: 0 0 0 3px rgba(0, 79, 60, 0.1);
}

.chart-hint[b-ohwtxvix8s] {
    margin: 0 0 0.5rem 0;
    font-size: 0.7rem;
    color: #9ca3af;
    font-style: italic;
}

/* Clickable chart cursors */
.distributor-chart[b-ohwtxvix8s]  .apexcharts-bar-area,
.chain-chart[b-ohwtxvix8s]  .apexcharts-bar-area,
.execution-chart[b-ohwtxvix8s]  .apexcharts-pie-series path,
.vip-chart[b-ohwtxvix8s]  .apexcharts-pie-series path {
    cursor: pointer;
}

.no-data[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: #9ca3af;
    font-size: 0.9rem;
    gap: 0.5rem;
}

.no-data[b-ohwtxvix8s]  .rzi {
    font-size: 2rem;
    opacity: 0.5;
}

/* Detail Section */
.detail-section[b-ohwtxvix8s] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.section-header[b-ohwtxvix8s] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-header h3[b-ohwtxvix8s] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.section-title-row[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    width: 100%;
}

.detail-stats[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: #6b7280;
}

.stat-item[b-ohwtxvix8s] {
    white-space: nowrap;
}

.stat-divider[b-ohwtxvix8s] {
    color: #d1d5db;
}

/* Void search input - uses unique class to avoid site.css .search-input conflict */
.void-search-input[b-ohwtxvix8s] {
    border-radius: 6px;
    font-size: 11px !important;
    font-weight: 500 !important;
}

.void-search-input[b-ohwtxvix8s]::placeholder {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #9ca3af !important;
}

.export-btn[b-ohwtxvix8s] {
    padding: 0.35rem 0.5rem !important;
    min-width: unset !important;
    margin-left: auto;
}

.export-btn[b-ohwtxvix8s]  .rzi {
    font-size: 1rem;
}

.excel-btn[b-ohwtxvix8s] {
    background: #217346 !important;
    border-color: #217346 !important;
}

.excel-btn:hover[b-ohwtxvix8s] {
    background: #1a5c38 !important;
    border-color: #1a5c38 !important;
}

.section-actions[b-ohwtxvix8s] {
    display: flex;
    gap: 0.75rem;
}

/* Grid Styles */
.void-grid[b-ohwtxvix8s] {
    border-radius: 8px;
    overflow: hidden;
}

/* Make all grid text smaller */
.void-grid[b-ohwtxvix8s]  .rz-data-row td,
.void-grid[b-ohwtxvix8s]  .rz-grid-table td {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
}

.void-grid[b-ohwtxvix8s]  .rz-column-title {
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.1;
    font-size: 0.6rem;
}

/* Chain Cell with Logo */
.chain-cell[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.chain-cell span[b-ohwtxvix8s] {
    font-size: 0.7rem;
    word-wrap: break-word;
    white-space: normal;
    line-height: 1.2;
}

.chain-logo[b-ohwtxvix8s] {
    width: 20px;
    height: 20px;
    object-fit: contain;
    border-radius: 3px;
}

/* Location Cell - Store + Address */
.location-cell[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.25rem 0;
}

.store-name[b-ohwtxvix8s] {
    font-weight: 500;
    font-size: 0.65rem;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.store-address[b-ohwtxvix8s] {
    font-size: 0.6rem;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Distributor Name */
.distributor-name[b-ohwtxvix8s] {
    font-size: 0.7rem;
}

.distributor-name-wrap[b-ohwtxvix8s] {
    font-size: 0.7rem;
    word-wrap: break-word;
    white-space: normal;
    line-height: 1.3;
    display: block;
}

/* Location ID Text */
.location-id-text[b-ohwtxvix8s] {
    font-size: 0.7rem;
}

/* Flavor Badge */
.flavor-badge[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.4rem;
    border-radius: 9999px;
    font-size: 0.6rem;
    font-weight: 500;
    color: white;
    white-space: nowrap;
    text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}

/* Flavor Text (legacy) */
.flavor-text[b-ohwtxvix8s] {
    font-size: 0.65rem;
    word-wrap: break-word;
    white-space: normal;
    line-height: 1.2;
    display: block;
}

/* Region Badge */
.region-badge[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.4rem;
    background: #e0e7ff;
    color: #3730a3;
    border-radius: 9999px;
    font-size: 0.65rem;
    font-weight: 500;
}

/* Custom column filter styling */
.void-grid[b-ohwtxvix8s]  .rz-cell-filter {
    position: relative;
}

/* Execution Flag Badges */
.execution-badge[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.4rem;
    border-radius: 9999px;
    font-size: 0.6rem;
    font-weight: 500;
    white-space: nowrap;
}

.execution-badge.exec-pog-void[b-ohwtxvix8s] {
    background: #fee2e2;
    color: #991b1b;
}

.execution-badge.exec-pog-void-90[b-ohwtxvix8s] {
    background: #ffedd5;
    color: #c2410c;
}

.execution-badge.exec-lth-opportunity[b-ohwtxvix8s] {
    background: #fef3c7;
    color: #92400e;
}

.execution-badge.exec-pog-did-buy[b-ohwtxvix8s] {
    background: #d1fae5;
    color: #065f46;
}

.execution-badge.exec-lth-did-buy[b-ohwtxvix8s] {
    background: #dcfce7;
    color: #166534;
}

.execution-badge.exec-default[b-ohwtxvix8s] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Data Bar */
.data-bar-cell[b-ohwtxvix8s] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    min-height: 20px;
}

.data-bar[b-ohwtxvix8s] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.data-bar-green[b-ohwtxvix8s] {
    background: rgba(16, 185, 129, 0.25);
}

.data-bar-value[b-ohwtxvix8s] {
    position: relative;
    z-index: 1;
    font-size: 0.7rem;
    font-weight: 500;
}

/* Last Sale Cell - Combined date and days */
.last-sale-cell[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1rem;
    padding: 0.15rem 0;
}

.last-sale-date[b-ohwtxvix8s] {
    font-size: 0.7rem;
    font-weight: 500;
}

.last-sale-days[b-ohwtxvix8s] {
    font-size: 0.55rem;
    color: #9ca3af;
}

.last-sale-warning[b-ohwtxvix8s] {
    color: #dc2626;
    font-weight: 500;
}

.never-sold[b-ohwtxvix8s] {
    color: #ef4444;
    font-weight: 600;
    font-size: 0.65rem;
}

.days-warning[b-ohwtxvix8s] {
    color: #dc2626;
    font-weight: 600;
}

/* VIP Status Badges */
.vip-badge[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.4rem;
    border-radius: 9999px;
    font-size: 0.6rem;
    font-weight: 500;
    white-space: nowrap;
}

.vip-badge.vip-certified[b-ohwtxvix8s] {
    background: #d1fae5;
    color: #065f46;
}

.vip-badge.vip-partial[b-ohwtxvix8s] {
    background: #fef3c7;
    color: #92400e;
}

.vip-badge.vip-not-reporting[b-ohwtxvix8s] {
    background: #fee2e2;
    color: #991b1b;
}

.vip-badge.vip-default[b-ohwtxvix8s] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Reporting Badge */
.reporting-badge[b-ohwtxvix8s] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.4rem;
    border-radius: 9999px;
    font-size: 0.6rem;
    font-weight: 500;
}

.reporting-badge.reporting-yes[b-ohwtxvix8s] {
    background: #d1fae5;
    color: #065f46;
}

.reporting-badge.reporting-no[b-ohwtxvix8s] {
    background: #fee2e2;
    color: #991b1b;
}

/* Loading Spinner */
.spinner-overlay[b-ohwtxvix8s] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.9);
    z-index: 1000;
}

.custom-loading[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.loading-gif[b-ohwtxvix8s] {
    width: 120px;
    height: auto;
}

.loading-text[b-ohwtxvix8s] {
    color: #374151;
    font-size: 1rem;
}

/* Responsive */
@media (max-width: 1400px) {
    .charts-row[b-ohwtxvix8s] {
        grid-template-columns: repeat(2, 1fr);
    }

    .dashboard-grid[b-ohwtxvix8s] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 1200px) {
    .charts-row[b-ohwtxvix8s] {
        grid-template-columns: 1fr;
    }

    .dashboard-grid[b-ohwtxvix8s] {
        grid-template-columns: 1fr;
    }

    .kpi-grid-cell[b-ohwtxvix8s] {
        order: -1;
    }

    .kpi-cards-vertical[b-ohwtxvix8s] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .kpi-cards-vertical .kpi-card[b-ohwtxvix8s] {
        flex: 1 1 calc(50% - 0.25rem);
        min-width: 140px;
    }
}

@media (max-width: 768px) {
    .void-tracker-container[b-ohwtxvix8s] {
        padding: 0.75rem;
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0));
    }

    .page-header[b-ohwtxvix8s] {
        flex-direction: column;
        gap: 0.75rem;
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
    }

    .header-content h1[b-ohwtxvix8s] {
        font-size: 1.35rem;
    }

    .header-content p[b-ohwtxvix8s] {
        font-size: 0.85rem;
    }

    .header-actions[b-ohwtxvix8s] {
        width: 100%;
        justify-content: flex-end;
        flex-wrap: wrap;
    }

    .header-actions[b-ohwtxvix8s]  .rz-button {
        min-height: 44px;
    }

    /* Warning/Info banner mobile */
    .warning-banner[b-ohwtxvix8s],
    .info-banner[b-ohwtxvix8s] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .warning-actions[b-ohwtxvix8s] {
        width: 100%;
    }

    .warning-actions[b-ohwtxvix8s]  .rz-button {
        width: 100%;
    }

    /* Filters mobile */
    .filters-section[b-ohwtxvix8s] {
        margin-bottom: 1rem;
    }

    .filters-header[b-ohwtxvix8s] {
        padding: 0.6rem 1rem;
    }

    .filters-row[b-ohwtxvix8s] {
        flex-direction: column;
        align-items: stretch;
        padding: 0 1rem 0.75rem 1rem;
        gap: 0.75rem;
    }

    .filter-group[b-ohwtxvix8s] {
        width: 100%;
    }

    .filter-group[b-ohwtxvix8s]  .rz-dropdown {
        width: 100% !important;
    }

    .filter-group[b-ohwtxvix8s]  .rz-dropdown .rz-dropdown-trigger {
        min-height: 44px;
    }

    .filter-actions[b-ohwtxvix8s] {
        margin-left: 0;
        justify-content: stretch;
        gap: 0.5rem;
        padding-top: 0.5rem;
    }

    .filter-actions[b-ohwtxvix8s]  .rz-button {
        flex: 1;
        min-height: 44px;
    }

    /* KPI Cards Row mobile */
    .kpi-cards-row[b-ohwtxvix8s] {
        flex-wrap: wrap;
        gap: 0.4rem;
        margin-bottom: 0.75rem;
    }

    .kpi-cards-row .kpi-card[b-ohwtxvix8s] {
        flex: 1 1 calc(50% - 0.2rem);
        min-width: 120px;
    }

    .kpi-card[b-ohwtxvix8s] {
        padding: 0.4rem 0.6rem;
    }

    .kpi-value[b-ohwtxvix8s] {
        font-size: 1rem;
    }

    .kpi-label[b-ohwtxvix8s] {
        font-size: 0.6rem;
    }

    .kpi-icon[b-ohwtxvix8s]  .rzi {
        font-size: 0.9rem;
    }

    /* WoW indicator mobile - hide "vs last week" text */
    .kpi-wow .wow-label[b-ohwtxvix8s] {
        display: none;
    }

    .kpi-wow[b-ohwtxvix8s] {
        font-size: 0.55rem;
        padding: 0.1rem 0.25rem;
    }

    /* Dashboard grid mobile */
    .dashboard-grid[b-ohwtxvix8s] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    /* Placeholder mobile */
    .placeholder-cell[b-ohwtxvix8s] {
        min-height: 200px;
    }

    /* Charts mobile */
    .charts-row[b-ohwtxvix8s] {
        grid-template-columns: 1fr;
        gap: 1rem;
        margin-bottom: 1rem;
    }

    .chart-card[b-ohwtxvix8s] {
        padding: 1rem;
    }

    .chart-card h3[b-ohwtxvix8s] {
        font-size: 0.95rem;
    }

    .chart-header-with-filter[b-ohwtxvix8s] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    /* Trend controls mobile */
    .trend-controls[b-ohwtxvix8s] {
        width: 100%;
        flex-wrap: wrap;
    }

    .trend-controls[b-ohwtxvix8s]  .rz-dropdown {
        flex: 1;
        min-width: 100px;
    }

    /* Detail section mobile */
    .detail-section[b-ohwtxvix8s] {
        padding: 1rem;
    }

    .section-header[b-ohwtxvix8s] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .section-actions[b-ohwtxvix8s] {
        width: 100%;
    }

    .search-input[b-ohwtxvix8s] {
        width: 100% !important;
    }

    .search-input[b-ohwtxvix8s]  .rz-textbox {
        width: 100%;
        min-height: 44px;
    }

    .void-grid[b-ohwtxvix8s] {
        height: 400px !important;
    }
}

/* Extra small screens */
@media (max-width: 375px) {
    .void-tracker-container[b-ohwtxvix8s] {
        padding: 0.5rem;
        padding-bottom: calc(0.5rem + env(safe-area-inset-bottom, 0));
    }

    .header-content h1[b-ohwtxvix8s] {
        font-size: 1.2rem;
    }

    .kpi-cards-section[b-ohwtxvix8s] {
        gap: 0.4rem;
    }

    .kpi-card[b-ohwtxvix8s] {
        padding: 0.4rem 0.6rem;
        min-width: 120px;
    }

    .kpi-value[b-ohwtxvix8s] {
        font-size: 1rem;
    }

    .kpi-icon[b-ohwtxvix8s]  .rzi {
        font-size: 0.9rem;
    }
}

/* Void Breakdown Table Styles */
.void-breakdown-table[b-ohwtxvix8s] {
    display: flex;
    flex-direction: column;
    max-height: 300px;
    overflow: hidden;
}

.breakdown-header[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.65rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.breakdown-body[b-ohwtxvix8s] {
    flex: 1;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.breakdown-row[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    padding: 0.4rem 0.75rem;
    border-bottom: 1px solid #f3f4f6;
    cursor: pointer;
    transition: background 0.15s;
}

.breakdown-row:hover[b-ohwtxvix8s] {
    background: #f9fafb;
}

.breakdown-row.selected[b-ohwtxvix8s] {
    background: rgba(0, 79, 60, 0.08);
    border-left: 3px solid var(--rz-primary);
    padding-left: calc(0.75rem - 3px);
}

.breakdown-col-name[b-ohwtxvix8s] {
    flex: 0 0 140px;
    font-size: 0.78rem;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 0.5rem;
}

/* Value columns with data bars */
.breakdown-col-value[b-ohwtxvix8s] {
    flex: 1;
    min-width: 70px;
    padding: 0 0.25rem;
}

.breakdown-col-value .data-bar-cell[b-ohwtxvix8s] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 22px;
    min-height: 22px;
    border-radius: 3px;
    overflow: hidden;
}

.breakdown-col-value .data-bar[b-ohwtxvix8s] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.breakdown-col-value .data-bar-value[b-ohwtxvix8s] {
    position: relative;
    z-index: 1;
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
    padding-right: 0.35rem;
}

/* Data bar colors for breakdown tables */
.data-bar-total[b-ohwtxvix8s] {
    background: rgba(99, 102, 241, 0.25);
}

.data-bar-never-buy[b-ohwtxvix8s] {
    background: rgba(239, 68, 68, 0.25);
}

.data-bar-90day[b-ohwtxvix8s] {
    background: rgba(249, 115, 22, 0.25);
}

/* Chain name cell with inline logo */
.chain-name-cell[b-ohwtxvix8s] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.chain-name-cell .chain-bar-logo[b-ohwtxvix8s] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    object-fit: contain;
    border-radius: 3px;
}

/* Header column styling */
.breakdown-header .breakdown-col-name[b-ohwtxvix8s] {
    font-size: 0.65rem;
}

.breakdown-header .breakdown-col-value[b-ohwtxvix8s] {
    font-size: 0.65rem;
    text-align: center;
}

/* Mobile responsive for breakdown tables */
@media (max-width: 768px) {
    .void-breakdown-table[b-ohwtxvix8s] {
        max-height: 250px;
    }

    .breakdown-col-name[b-ohwtxvix8s] {
        flex: 0 0 100px;
        font-size: 0.7rem;
    }

    .breakdown-col-value[b-ohwtxvix8s] {
        min-width: 55px;
    }

    .breakdown-col-value .data-bar-value[b-ohwtxvix8s] {
        font-size: 0.65rem;
    }

    .chain-name-cell .chain-bar-logo[b-ohwtxvix8s] {
        width: 16px;
        height: 16px;
    }
}