/* Extra homepage styling: pagination, job row tweaks, and small UI polish */

/* Pagination */
.pagination {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 16px;
}

.pagination .page-btn {
  border: 1px solid #e6eefc;
  background: #ffffff;
  padding: 8px 12px;
  border-radius: 10px;
  cursor: pointer;
  color: #0d46a1;
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(17, 80, 183, 0.06);
  transition: transform 120ms ease, background 120ms ease, color 120ms ease;
}

.pagination .page-btn:hover:not(:disabled) {
  transform: translateY(-3px);
  background: #f0f6ff;
}

.pagination .page-btn.active {
  background: linear-gradient(90deg, #0d46a1 0%, #1f62cd 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 10px 28px rgba(31, 98, 205, 0.14);
}

.pagination .page-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
  background: #f6f8fb;
}

/* Job row polish */
.job-row {
  padding: 18px 22px;
  border-radius: 12px;
}

.job-row-logo {
  width: 56px;
  height: 56px;
  border-radius: 10px;
  font-size: 20px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #f8fafc 0%, #eef6ff 100%);
}

.job-row-title {
  font-size: 1.15rem;
}

.job-row-meta-line {
  font-size: 0.9rem;
  color: #5f6f87;
}

.job-row-action .row-btn {
  padding: 8px 14px;
  border-radius: 9px;
  font-weight: 600;
}

/* Add a subtle secondary action style for future use */
.row-btn.secondary {
  background: #fff;
  color: #0d46a1;
  border: 1px solid #dbeafe;
}

/* Slight breathing room within the list */
.job-list { padding: 8px; }

/* Responsive tweaks */
@media (max-width: 600px) {
  .pagination { gap: 6px; }
  .job-row { padding: 14px; }
}