/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 25 2026 | 16:38:23 */
/* ==========================================
   JOB SLIDE SYSTEM (LOCKED HEIGHT VERSION)
   ========================================== */

.job-slide-card {
  position: relative;
  overflow: hidden;
}

/* Panels */
.job-panel {
  width: 100%;
  transition: transform 0.45s ease, opacity 0.45s ease;
}

/* Application panel fills full card height */
.job-application-panel {
  position: absolute;
  inset: 0;
  transform: translateX(105%);
  opacity: 0;
  pointer-events: none;

  /* KEY: force full height */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* Slide OUT job description */
.job-slide-card.is-applying .job-description-panel {
  transform: translateX(-105%);
  opacity: 0;
  pointer-events: none;
}

/* Slide IN application */
.job-slide-card.is-applying .job-application-panel {
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}

/* Clickable buttons */
.job-apply-trigger,
.job-back-trigger {
  cursor: pointer;
  transition: transform 0.15s ease;
}

.job-apply-trigger:hover,
.job-back-trigger:hover {
  transform: translateY(-1px);
}

.job-apply-trigger:active,
.job-back-trigger:active {
  transform: translateY(0);
}

/* ==========================================
   MOBILE (disable slide, stack instead)
   ========================================== */

@media (max-width: 767px) {

  .job-application-panel {
    position: relative;
    inset: auto;
    transform: none;
    opacity: 1;
    pointer-events: auto;
    margin-top: 24px;
    display: block;
  }

  .job-slide-card.is-applying .job-description-panel {
    transform: none;
    opacity: 1;
    pointer-events: auto;
  }
}