.list-container {
    padding: 20px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.filters {
    background: #f9f9f9;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}
.filter-group {
    flex: 1;
}

.filter-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
}

.filter-group input,
.filter-group select {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.filter-actions {
    display: flex;
    gap: 10px;
    margin-top: 15px;
}

.btn-primary,
.btn-secondary,
.btn-update,
.btn-danger {
    padding: 5px 15px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-decoration: none;
    color: white;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 12px;
}

.btn-primary {
    background-color: var(--primary-blue)
}

.btn-secondary {
    background-color: #6c757d;
}

.btn-update {
    background-color: #28a745;
}

.btn-danger {
    background-color: #dc3545;
}

.table-wrapper {
    overflow-x: auto;
    width: 100%;
}

table {
    width: 100%;
    border-collapse: collapse;
    white-space: nowrap;
}

th {
    background-color: var(--primary-light-blue);
    font-weight: 700;
    color: var(--primary-text);
}

.status-badge {
    padding: 5px 10px;
    border-radius: 12px;
    color: white;
    font-weight: 600;
}

.status-paid .status-badge {
    background-color: #28a745;
}

.status-partial .status-badge {
    background-color: #ffc107;
    color: #333;
}

.status-pending .status-badge {
    background-color: #dc3545;
}

/* Resume shared status badges */
.status-position_closed {
    background-color: #ff4d4d;
    color: #fff;
}

.status-not_shortlisted {
    background-color: #f39c12;
    color: #fff;
}

.status-no_response {
    background-color: #3498db;
    color: #fff;
}

.inactive-row {
    cursor: pointer;
}

.inactive-row:hover {
    background-color: #f8f9fa;
}

.inactive-reason {
    padding: 0 !important;
    border-top: none !important;
}

/* Status indicators with different icons */
.status-indicators {
    display: flex;
    gap: 5px;
    justify-content: center;
    align-items: center;
}

.indicator {
    width: 20px;
    height: 20px;
    display: inline-block;
    position: relative;
    color: #ddd;
    transition: transform 0.3s ease, color 0.3s ease;
    font-size: 16px; /* Adjust icon size */
}

.indicator:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.3s ease;
}

/* Icons based on class */
.indicator-certificate:before { content: "\f5a2"; } /* fa-award */
.indicator-placement-session:before { content: "\f51c"; } /* fa-chalkboard-teacher */
.indicator-mock-interview:before { content: "\f130"; } /* fa-microphone */
.indicator-onboarding-call:before { content: "\f2a0"; } /* fa-handshake */
.indicator-interview-question:before { content: "\f059"; } /* fa-question-circle */
.indicator-resume-template:before { content: "\f15c"; } /* fa-file-alt */

.indicator.highlighted {
    color: transparent; /* Hide the base grey color */
}

.indicator.highlighted:before {
    transform: translate(-50%, -50%) scale(1.2);
}

/* Highlight colors */
.indicator-certificate.highlighted:before {
    color: #f1c40f; /* Yellow */
    text-shadow: 0 0 8px rgba(241, 196, 15, 0.7);
}
.indicator-placement-session.highlighted:before {
    color: #3498db; /* Blue */
    text-shadow: 0 0 8px rgba(52, 152, 219, 0.7);
}
.indicator-mock-interview.highlighted:before {
    color: #e74c3c; /* Red */
    text-shadow: 0 0 8px rgba(231, 76, 60, 0.7);
}
.indicator-onboarding-call.highlighted:before {
    color: #2ecc71; /* Green */
    text-shadow: 0 0 8px rgba(46, 204, 113, 0.7);
}
.indicator-interview-question.highlighted:before {
    color: #9b59b6; /* Purple */
    text-shadow: 0 0 8px rgba(155, 89, 182, 0.7);
}
.indicator-resume-template.highlighted:before {
    color: #e67e22; /* Orange */
    text-shadow: 0 0 8px rgba(230, 126, 34, 0.7);
}

/* Hover effects */
.indicator:hover:before {
    transform: translate(-50%, -50%) scale(1.4);
}

.pending-amount {
    font-weight: 700;
}

.status-pending .pending-amount,
.status-partial .pending-amount {
    color: #dc3545;
}

.emi-cell {
    min-width: 180px;
}

.highlight-pending {
    color: #dc8935;
    font-weight: bold;
}

.highlight-paid {
    color: #28a745;
    font-weight: bold;
}

.highlight-cell {
    background-color: #fff3cd;
}

.pagination {
    justify-content: center;
    margin-top: 20px;
}

.pagination .step-links a,
.pagination .current {
    padding: 5px 10px;
    margin: 0 2px;
    border: 1px solid #ddd;
    text-decoration: none;
    color: #007bff;
}

.pagination .current {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}
.pagination .page-search {
    display: inline-block;
    margin-left: 10px;
}

.pagination .page-search input {
    width: 60px;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.pagination .page-search button {
    padding: 5px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #f0f0f0;
    cursor: pointer;
}
.filters {
    display: flex;
    flex-direction: column;
}

.filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 15px;
}

.filter-group {
    flex: 1 1 200px;
}

table {
    font-size: 14px;
}

th, td {
    padding: 12px 15px;
}
 
.btn-conversation {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 12px;
}
