/* ---------------------------------------------------------
   Shimmer timing
   Let:
       shimmer duration, d = 0.5s
       pause between btn shimmers, p = 2.0s
       number of btns, n = 4
   Then:
       full animation-duration, F = n*(d+p) = 10s
       keyframes % = d / F = 5%
--------------------------------------------------------- */

/* Common shimmer base for all action buttons */
#proc_btn,
#needs_btn,
#wait_btn,
#trash_btn,
#subscribe_btn,
#unsubscribe_btn {
  position: relative;
  overflow: hidden;
}

/* Common shimmer ::before baseline */
#proc_btn::before,
#needs_btn::before,
#wait_btn::before,
#trash_btn::before,
#subscribe_btn::before,
#unsubscribe_btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, var(--shimmer-color), transparent);
  animation: shimmer 10s linear infinite;
  z-index: 1;
}

/* White shimmer for solid dark/danger buttons */
#proc_btn.btn-dark::before,
#needs_btn.btn-dark::before,
#wait_btn.btn-dark::before,
#trash_btn.btn-danger::before,
#subscribe_btn.btn-info::before,
#unsubscribe_btn.btn-danger::before {
  --shimmer-color: rgba(255, 255, 255, 1);
}

/* Colored shimmer for outline buttons */
#proc_btn.btn-outline-dark::before,
#needs_btn.btn-outline-dark::before,
#wait_btn.btn-outline-dark::before {
  --shimmer-color: var(--bs-gray);
}

#subscribe_btn.btn-outline-info::before {
  --shimmer-color: var(--bs-info);
}

#trash_btn.btn-outline-danger::before,
#unsubscribe_btn.btn-outline-danger::before {
  --shimmer-color: var(--bs-danger);
}

/* Individual delays */
#proc_btn::before        { animation-delay: 0s; }
#needs_btn::before       { animation-delay: 2.5s; }
#wait_btn::before        { animation-delay: 5.0s; }
#trash_btn::before       { animation-delay: 7.5s; }
#subscribe_btn::before   { animation-delay: 2.5s; }
#unsubscribe_btn::before { animation-delay: 7.5s; }

/* Ensure content stays above shimmer */
#proc_btn > *, #needs_btn > *, #wait_btn > *,
#trash_btn > *, #subscribe_btn > *, #unsubscribe_btn > * {
  position: relative;
  z-index: 1;
}

/* Shimmer keyframes */
@keyframes shimmer {
  0% { left: -100%; }
  5%, 100% { left: 100%; }
}