/**
 * Flexible Tiered Rewards – Frontend Stylesheet
 *
 * Modern UI for the tiered rewards progress bar.
 * Cart/Checkout: callout → thin track → horizontal tier steps → info card.
 * Mini-cart/Sidebar: callout → vertical stepper list.
 *
 * @package FlexibleTieredRewards
 * @version 5.0
 */

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Design Tokens                                                             */
/* ═══════════════════════════════════════════════════════════════════════════ */

:root {
  --ftr-accent: #1a1a1a;
  --ftr-accent-light: #4a4a4a;
  --ftr-accent-dark: #000000;
  --ftr-success: #2d2d2d;
  --ftr-success-light: #555555;
  --ftr-success-dark: #111111;
  --ftr-claim-bg: #1a1a1a;
  --ftr-claim-hover: #000000;

  --ftr-bg: #ffffff;
  --ftr-bg-subtle: #f7f7f7;
  --ftr-border: #e0e0e0;
  --ftr-border-light: #eeeeee;

  --ftr-text: #1a1a1a;
  --ftr-text-muted: #666666;
  --ftr-text-light: #999999;

  --ftr-track-bg: #e8e8e8;
  --ftr-track-height: 8px;
  --ftr-track-radius: 99px;

  --ftr-shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
  --ftr-shadow-md: 0 4px 14px rgba(0,0,0,.1), 0 2px 6px rgba(0,0,0,.05);
  --ftr-shadow-lg: 0 10px 30px rgba(0,0,0,.12), 0 4px 10px rgba(0,0,0,.06);

  --ftr-radius: 16px;
  --ftr-radius-sm: 10px;

  --ftr-ease: cubic-bezier(.4, 0, .2, 1);
  --ftr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --ftr-duration: .5s;

  --ftr-mx: 50%;
  --ftr-my: 0%;
}

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Wrapper                                                                   */
/* ═══════════════════════════════════════════════════════════════════════════ */

.ftr-progress-bar-wrapper {
  margin: 0 0 28px;
  max-width: 100%;
}

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Cart / Checkout – Card Container                                          */
/* ═══════════════════════════════════════════════════════════════════════════ */

.ftr-progress-bar.ftr-context-default,
.ftr-progress-bar.ftr-context-checkout {
  position: relative;
  background: var(--ftr-bg);
  border: 1px solid var(--ftr-border);
  border-radius: 12px;
  padding: 16px 20px 14px;
  box-shadow: var(--ftr-shadow-sm);
  overflow: visible;
  transition: box-shadow var(--ftr-duration) var(--ftr-ease),
              border-color var(--ftr-duration) var(--ftr-ease);
  width: 100%;
  box-sizing: border-box;
}

/* Hover lift */
.ftr-progress-bar.ftr-context-default:hover,
.ftr-progress-bar.ftr-context-checkout:hover {
  box-shadow: var(--ftr-shadow-md);
}

.ftr-progress-bar.ftr-context-default > *,
.ftr-progress-bar.ftr-context-checkout > * {
  position: relative;
  z-index: 1;
}

/* ─── Callout / Headline ─────────────────────────────────────────────────── */

.ftr-next-callout {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  margin: 0 0 12px;
  padding: 0;
  line-height: 1.4;
}

.ftr-callout-eyebrow {
  display: block;
  width: 100%;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ftr-text-muted);
  margin-bottom: 1px;
}

.ftr-callout-amount {
  font-size: 20px;
  font-weight: 800;
  color: var(--ftr-accent);
  letter-spacing: -.02em;
  line-height: 1.1;
  transition: color .3s var(--ftr-ease);
}

.ftr-callout-amount.ftr-just-counted {
  color: var(--ftr-accent-dark);
}

.ftr-callout-headline {
  font-size: 14px;
  font-weight: 500;
  color: var(--ftr-text);
}

.ftr-next-callout.ftr-all-unlocked .ftr-callout-amount {
  color: var(--ftr-success);
  font-size: 18px;
}

.ftr-next-callout.ftr-all-unlocked .ftr-callout-eyebrow {
  color: var(--ftr-success-dark);
}

/* ─── Thin Progress Track ────────────────────────────────────────────────── */

/*
 * The track is the main coordinate container. It has large top/bottom padding
 * so the absolutely-positioned tier icons (above) and labels (below) have room.
 * The visible bar is drawn by ::after on the track itself.
 */
.ftr-track {
  position: relative;
  height: var(--ftr-track-height);
  background: var(--ftr-track-bg);
  border-radius: var(--ftr-track-radius);
  margin: 12px 12px 52px;
  overflow: visible;
}

.ftr-track-fill {
  position: absolute;
  top: 0; left: 0;
  height: 100%;
  border-radius: var(--ftr-track-radius);
  background: linear-gradient(90deg, var(--ftr-accent-light), var(--ftr-accent));
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
  transition: width .8s var(--ftr-ease);
  will-change: width;
}

.ftr-track-fill::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.25) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: ftr-shimmer 2.5s ease-in-out infinite;
}

@keyframes ftr-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ─── Tier dots (icons on the track) ─────────────────────────────────────── */

.ftr-dot {
  position: absolute;
  top: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100px;
  z-index: 3;
  pointer-events: none;
}

/* The circle icon — sits centered on the track line */
.ftr-dot-icon {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px;
  min-height: 22px;
  border-radius: 50%;
  background: var(--ftr-bg);
  border: 2px solid var(--ftr-border);
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: relative;
  box-sizing: border-box;
  margin-top: -11px; /* center on the track line */
  flex-shrink: 0;
  transition: background .4s var(--ftr-ease),
              border-color .4s var(--ftr-ease),
              box-shadow .4s var(--ftr-ease);
}

/* Unlocked icon — filled with checkmark */
.ftr-dot.ftr-unlocked .ftr-dot-icon {
  background: var(--ftr-accent);
  border-color: var(--ftr-accent);
  box-shadow: 0 0 0 2px rgba(0,0,0,.06);
}

.ftr-dot.ftr-unlocked .ftr-dot-icon::after {
  content: "";
  display: block;
  width: 7px; height: 4px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}

/* Active — ring with inner dot */
.ftr-dot.ftr-active .ftr-dot-icon {
  border-color: var(--ftr-accent-light);
  box-shadow: 0 0 0 2px rgba(0,0,0,.04);
}

.ftr-dot.ftr-active .ftr-dot-icon::after {
  content: "";
  display: block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--ftr-accent);
}

/* Locked — dimmed */
.ftr-dot.ftr-locked .ftr-dot-icon {
  background: var(--ftr-bg-subtle);
  border-color: var(--ftr-border);
  opacity: .45;
}

/* Amount label below icon */
.ftr-dot-label {
  display: block;
  margin-top: 4px;
  font-size: 10px;
  font-weight: 700;
  color: var(--ftr-text-muted);
  white-space: nowrap;
  text-align: center;
  transition: color .3s var(--ftr-ease);
}

.ftr-dot.ftr-unlocked .ftr-dot-label { color: var(--ftr-accent); }
.ftr-dot.ftr-locked .ftr-dot-label   { color: var(--ftr-text-light); }

/* Reward name label below amount */
.ftr-dot .ftr-tier-col-label {
  display: block;
  margin-top: 1px;
  font-size: 10px;
  font-weight: 500;
  color: var(--ftr-text-light);
  text-align: center;
  line-height: 1.2;
  max-width: 90px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color .3s var(--ftr-ease);
}

.ftr-dot.ftr-unlocked .ftr-tier-col-label { color: var(--ftr-text); font-weight: 600; }
.ftr-dot.ftr-locked .ftr-tier-col-label   { color: var(--ftr-text-light); opacity: .6; }

/* Current position marker */
.ftr-here {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--ftr-accent);
  border: 2px solid var(--ftr-bg);
  box-shadow: 0 0 0 2px rgba(0,0,0,.08);
  z-index: 4;
  transition: left .8s var(--ftr-ease);
  will-change: left;
}

.ftr-here::before {
  display: none;
}

@keyframes ftr-pulse {
  0%   { transform: scale(.8); opacity: .5; }
  100% { transform: scale(1.5); opacity: 0; }
}

/* Subtotal pill — hidden; callout already shows the amount */
.ftr-context-default .ftr-here-label,
.ftr-context-checkout .ftr-here-label {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}

/* Unlock celebration */
.ftr-dot.ftr-just-unlocked .ftr-dot-icon {
  animation: ftr-step-unlock .6s var(--ftr-ease-spring);
  box-shadow: 0 0 0 6px rgba(0,0,0,.12), 0 0 12px rgba(0,0,0,.06);
}

@keyframes ftr-step-unlock {
  0%  { transform: scale(1); }
  40% { transform: scale(1.3); }
  100%{ transform: scale(1); }
}

/* ─── Info Card ──────────────────────────────────────────────────────────── */

.ftr-info-card {
  margin: 0;
  padding: 10px 14px;
  background: var(--ftr-bg-subtle);
  border: 1px solid var(--ftr-border-light);
  border-radius: 8px;
  font-size: 12px;
  color: var(--ftr-text-muted);
  line-height: 1.5;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 3px 6px;
}

.ftr-info-card.ftr-info-complete {
  background: rgba(0,0,0,.03);
  border-color: rgba(0,0,0,.08);
  color: var(--ftr-success-dark);
  font-weight: 600;
}

.ftr-info-card.ftr-info-claimable {
  background: rgba(0,0,0,.02);
  border-color: rgba(0,0,0,.06);
}

.ftr-info-togo-amount {
  font-weight: 700;
  color: var(--ftr-accent);
}

/* ─── Claim Button ───────────────────────────────────────────────────────── */

.ftr-claim-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 18px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #fff;
  background: linear-gradient(135deg, var(--ftr-claim-bg), var(--ftr-claim-hover));
  border: none;
  border-radius: 99px;
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 3px 12px rgba(0,0,0,.2);
  transition: transform .2s var(--ftr-ease-spring),
              box-shadow .2s var(--ftr-ease),
              background .3s var(--ftr-ease);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  line-height: 1;
  min-height: 30px;
}

.ftr-claim-btn:hover {
  transform: translateY(-1px) scale(1.03);
  box-shadow: 0 5px 18px rgba(0,0,0,.25);
}

.ftr-claim-btn:active {
  transform: translateY(0) scale(.98);
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}

.ftr-claim-btn:focus-visible {
  outline: 2px solid var(--ftr-claim-bg);
  outline-offset: 2px;
}

.ftr-claim-btn.ftr-claimed {
  background: var(--ftr-success);
  box-shadow: 0 3px 12px rgba(0,0,0,.15);
  cursor: default;
  pointer-events: none;
}

.ftr-claim-btn:disabled:not(.ftr-claimed) {
  opacity: .65;
  cursor: wait;
}

.ftr-ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,.4);
  transform: scale(0);
  animation: ftr-ripple-anim .6s ease-out forwards;
  pointer-events: none;
}

@keyframes ftr-ripple-anim {
  to { transform: scale(2.5); opacity: 0; }
}

.ftr-claim-error {
  display: block;
  width: 100%;
  font-size: 12px;
  color: var(--ftr-claim-hover);
  margin-top: 4px;
}

.ftr-claim-error:empty {
  display: none;
}

/* ─── Refreshing State ───────────────────────────────────────────────────── */

.ftr-progress-bar.ftr-refreshing {
  opacity: .55;
  pointer-events: none;
  transition: opacity .15s ease;
}

.ftr-progress-bar.ftr-refreshing .ftr-track-fill::after {
  animation-duration: 1s;
}

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Mini-Cart / Sidebar – Vertical Stepper                                    */
/* ═══════════════════════════════════════════════════════════════════════════ */

.ftr-progress-bar.ftr-stepper {
  position: relative;
  background: var(--ftr-bg);
  border-radius: var(--ftr-radius-sm);
  padding: 18px 16px 14px;
  font-size: 13px;
}

.ftr-stepper .ftr-next-callout {
  margin: 0 0 14px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--ftr-border-light);
  gap: 4px 8px;
}

.ftr-stepper .ftr-callout-eyebrow { font-size: 10px; margin-bottom: 1px; }
.ftr-stepper .ftr-callout-amount  { font-size: 20px; font-weight: 800; }
.ftr-stepper .ftr-callout-headline { font-size: 13px; }
.ftr-stepper .ftr-next-callout.ftr-all-unlocked .ftr-callout-amount { font-size: 16px; }

/* ─── Stepper List ───────────────────────────────────────────────────────── */

.ftr-stepper-list {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

.ftr-stepper-list::before {
  content: "";
  position: absolute;
  top: 14px; bottom: 14px; left: 13px;
  width: 2px;
  background: var(--ftr-border);
  border-radius: 2px;
  z-index: 0;
}

.ftr-step {
  position: relative;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  grid-template-rows: auto auto;
  gap: 0 10px;
  align-items: start;
  padding: 8px 0;
  z-index: 1;
  transition: opacity .3s var(--ftr-ease);
}

.ftr-step + .ftr-step { margin-top: 2px; }

/* Step icon */
.ftr-step-icon {
  grid-row: 1 / 3;
  grid-column: 1;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--ftr-bg);
  border: 2.5px solid var(--ftr-border);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  transition: background .4s var(--ftr-ease),
              border-color .4s var(--ftr-ease),
              box-shadow .4s var(--ftr-ease),
              transform .3s var(--ftr-ease-spring);
}

.ftr-step.ftr-unlocked .ftr-step-icon {
  background: var(--ftr-accent);
  border-color: var(--ftr-accent);
  box-shadow: 0 0 0 3px rgba(0,0,0,.08);
}

.ftr-step.ftr-unlocked .ftr-step-icon::after {
  content: "";
  display: block;
  width: 8px; height: 5px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}

.ftr-step.ftr-active .ftr-step-icon {
  border-color: var(--ftr-accent-light);
  box-shadow: 0 0 0 3px rgba(0,0,0,.06);
}

.ftr-step.ftr-active .ftr-step-icon::before {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 2px solid var(--ftr-accent-light);
  opacity: 0;
  animation: ftr-pulse 2.5s ease-out infinite;
}

.ftr-step.ftr-active .ftr-step-icon::after {
  content: "";
  display: block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--ftr-accent);
}

.ftr-step.ftr-locked { opacity: .45; }
.ftr-step.ftr-locked .ftr-step-icon {
  background: var(--ftr-bg-subtle);
  border-color: var(--ftr-border);
}

/* Step text */
.ftr-step-label {
  grid-column: 2; grid-row: 1;
  font-size: 13px; font-weight: 600;
  color: var(--ftr-text);
  line-height: 1.3; padding-top: 4px;
  transition: color .3s var(--ftr-ease);
}
.ftr-step.ftr-unlocked .ftr-step-label { color: var(--ftr-accent); }
.ftr-step.ftr-locked .ftr-step-label   { color: var(--ftr-text-light); }

.ftr-step-threshold {
  grid-column: 3; grid-row: 1;
  font-size: 12px; font-weight: 700;
  color: var(--ftr-text-muted);
  padding-top: 5px; white-space: nowrap;
  transition: color .3s var(--ftr-ease);
}
.ftr-step.ftr-unlocked .ftr-step-threshold { color: var(--ftr-accent); }
.ftr-step.ftr-locked .ftr-step-threshold   { color: var(--ftr-text-light); }

.ftr-step-status {
  grid-column: 2 / 4; grid-row: 2;
  font-size: 12px; color: var(--ftr-text-muted);
  padding-top: 2px;
  display: flex; flex-wrap: wrap;
  align-items: center; gap: 4px 8px;
}

.ftr-step-remain { font-weight: 700; color: var(--ftr-accent); }

.ftr-step .ftr-claim-btn {
  padding: 5px 14px; font-size: 11px; min-height: 28px;
}

.ftr-step.ftr-just-unlocked .ftr-step-icon {
  animation: ftr-step-unlock .6s var(--ftr-ease-spring);
  box-shadow: 0 0 0 6px rgba(0,0,0,.15), 0 0 16px rgba(0,0,0,.08);
}

/* Many-tiers compact */
.ftr-stepper.ftr-many-tiers .ftr-step { padding: 5px 0; }
.ftr-stepper.ftr-many-tiers .ftr-step-icon { width: 22px; height: 22px; }
.ftr-stepper.ftr-many-tiers .ftr-stepper-list::before { left: 10px; }
.ftr-stepper.ftr-many-tiers .ftr-step-label { font-size: 12px; }
.ftr-stepper.ftr-many-tiers .ftr-step-threshold { font-size: 11px; }

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Free Gift – Cart Display Overrides                                        */
/* ═══════════════════════════════════════════════════════════════════════════ */

tr.ftr-gift-row,
.ftr-gift-row {
  background: rgba(0,0,0,.02) !important;
}

.ftr-thumb-wrapper { position: relative; display: inline-block; }

.ftr-free-badge {
  position: absolute; top: 4px; left: 4px;
  background: var(--ftr-accent); color: #fff;
  font-size: 9px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase;
  padding: 2px 7px; border-radius: 4px;
  line-height: 1.4;
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
  z-index: 2;
}

.ftr-gift-tag {
  display: inline-block;
  background: linear-gradient(135deg, var(--ftr-accent), var(--ftr-accent-dark));
  color: #fff; font-size: 10px; font-weight: 700;
  letter-spacing: .04em; padding: 2px 8px;
  border-radius: 4px; vertical-align: middle;
  margin-right: 6px; line-height: 1.5;
}

.ftr-free-only-price {
  display: inline-block;
  background: rgba(0,0,0,.05);
  color: var(--ftr-success-dark);
  font-size: 13px; font-weight: 700;
  padding: 3px 12px; border-radius: 6px;
}

.ftr-gift-qty {
  display: inline-flex;
  align-items: center; justify-content: center;
  width: 32px; height: 32px;
  background: var(--ftr-bg-subtle);
  border: 1px solid var(--ftr-border);
  border-radius: 6px;
  font-size: 13px; font-weight: 600;
  color: var(--ftr-text-muted);
  cursor: not-allowed;
}

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Responsive                                                                */
/* ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  .ftr-progress-bar.ftr-context-default,
  .ftr-progress-bar.ftr-context-checkout {
    padding: 14px 14px 12px;
  }

  .ftr-callout-amount { font-size: 18px; }
  .ftr-callout-headline { font-size: 13px; }

  .ftr-track { margin: 10px 8px 46px; }
  .ftr-dot-icon { width: 20px !important; height: 20px !important; min-width: 20px; min-height: 20px; margin-top: -10px; }
  .ftr-dot-label { font-size: 9px; }
  .ftr-dot .ftr-tier-col-label { font-size: 9px; max-width: 75px; }

  .ftr-info-card { font-size: 11px; padding: 8px 10px; }
}

@media (max-width: 480px) {
  .ftr-progress-bar.ftr-context-default,
  .ftr-progress-bar.ftr-context-checkout {
    padding: 14px 12px 12px;
    border-radius: 10px;
  }

  .ftr-callout-amount { font-size: 20px; }
  .ftr-callout-headline { font-size: 13px; }
  .ftr-callout-eyebrow { font-size: 10px; }
  .ftr-next-callout { margin-bottom: 12px; }

  .ftr-track { margin: 8px 6px 40px; }
  .ftr-dot-icon { width: 18px !important; height: 18px !important; min-width: 18px; min-height: 18px; margin-top: -9px; }
  .ftr-dot-label { font-size: 9px; }
  .ftr-dot .ftr-tier-col-label { font-size: 8px; max-width: 60px; }
  .ftr-dot { width: 70px; }

  .ftr-claim-btn { padding: 7px 16px; font-size: 12px; min-height: 32px; }

  /* Stepper compact */
  .ftr-stepper { padding: 14px 12px 10px; }
  .ftr-stepper .ftr-callout-amount { font-size: 18px; }
  .ftr-step-label { font-size: 12px; }
  .ftr-step-threshold { font-size: 11px; }
}

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Reduced Motion                                                            */
/* ═══════════════════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  .ftr-track-fill, .ftr-here, .ftr-here-label,
  .ftr-dot-icon, .ftr-step-icon,
  .ftr-claim-btn {
    transition-duration: .01ms !important;
  }
  .ftr-track-fill::after,
  .ftr-here::before,
  .ftr-step.ftr-active .ftr-step-icon::before,
  .ftr-dot.ftr-active .ftr-dot-icon::before,
  .ftr-dot.ftr-just-unlocked .ftr-dot-icon,
  .ftr-step.ftr-just-unlocked .ftr-step-icon {
    animation: none !important;
  }
  .ftr-ripple { animation: none !important; display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  High Contrast / Forced Colors                                             */
/* ═══════════════════════════════════════════════════════════════════════════ */

@media (forced-colors: active) {
  .ftr-track-fill { background: Highlight; }
  .ftr-here { background: Highlight; border-color: Canvas; }
  .ftr-claim-btn { border: 2px solid ButtonText; }
  .ftr-step.ftr-unlocked .ftr-step-icon,
  .ftr-dot.ftr-unlocked .ftr-dot-icon { background: Highlight; border-color: Highlight; }
  .ftr-free-badge, .ftr-gift-tag { border: 1px solid ButtonText; }
}

/* ═══════════════════════════════════════════════════════════════════════════ */
/*  Print                                                                     */
/* ═══════════════════════════════════════════════════════════════════════════ */

@media print {
  .ftr-progress-bar { box-shadow: none !important; border: 1px solid #ccc !important; }
  .ftr-track-fill::after, .ftr-here::before { animation: none !important; }
  .ftr-claim-btn { display: none; }
}