/* Custom styles for EduRecruit Job Vacancy Monitor */

/* Login page styling */
.login-page {
    background: var(--bs-dark);
    min-height: 100vh;
}

/* Dashboard stats cards */
.card .display-4 {
    font-size: 2.5rem;
    font-weight: 300;
}

/* General spacing and typography improvements */
.card {
    margin-bottom: 1.5rem;
}

.card-header h5 {
    margin-bottom: 0;
}

.table th {
    font-weight: 600;
    white-space: nowrap;
}

/* Badge styling */
.badge {
    font-weight: 500;
    padding: 0.35em 0.65em;
}

/* Vacancy detail modal */
.modal-body h6 {
    font-weight: 600;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    color: var(--bs-info);
}

/* Improve table readability */
.table-responsive {
    margin-bottom: 1rem;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: rgba(255, 255, 255, 0.03);
}

/* Feature icon styling */
.feature-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    font-size: 1.5rem;
    color: #fff;
    border-radius: 0.75rem;
}

/* Status indicators */
.status-indicator {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
}

.status-active {
    background-color: var(--bs-success);
}

.status-pending {
    background-color: var(--bs-warning);
}

.status-inactive {
    background-color: var(--bs-secondary);
}

/* Footer styling */
footer {
    margin-top: 3rem;
    padding: 1.5rem 0;
    font-size: 0.9rem;
}

/* Improve form element spacing */
.form-label {
    margin-bottom: 0.25rem;
    font-weight: 500;
}

.form-text {
    margin-top: 0.25rem;
    font-size: 0.75rem;
}

/* Card hover effects */
.card-hover:hover {
    transform: translateY(-5px);
    transition: transform 0.3s ease;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}

/* Custom buttons */
.btn-icon {
    display: inline-flex;
    align-items: center;
}

.btn-icon svg {
    margin-right: 0.5rem;
}

/* Animation for loader */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loader {
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    border-top: 3px solid var(--bs-primary);
    width: 20px;
    height: 20px;
    animation: spin 1s linear infinite;
    display: inline-block;
    margin-right: 10px;
}

/* Improve modal animations */
.modal.fade .modal-dialog {
    transition: transform 0.2s ease-out;
}

.ql-editor {
    color: #212529; /* Bootstrap's default text color */
}

th a {
    color: inherit;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
}

th a:hover {
    color: #0d6efd;
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
    .display-4 {
        font-size: 2rem;
    }
    
    .card-title {
        font-size: 1.25rem;
    }
}