/* Wash check-in component. Generated from the final legacy cascade; edit this module only. */
.wash-checkin-btn { background: var(--color-surface); color: var(--color-text-secondary); transition: all var(--transition-fast); }

.wash-checkin-btn.signed,.wash-checkin-btn:hover { border-color: var(--color-accent); }

.wash-header-actions .wash-checkin-btn { transition: transform var(--transition-fast),background var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast); }

.wash-checkin-btn { display: inline-flex; }

.wash-checkin-btn,.wash-header-actions .wash-checkin-btn { align-items: center; display: inline-flex; }

.wash-header-actions .wash-checkin-btn,.wash-header-actions .wash-checkin-btn.signed[data-streak]::after { border-radius: var(--radius-full); box-sizing: border-box; }

.wash-checkin-btn:hover,.wash-points-float { color: var(--color-accent); }

.wash-checkin-btn.signed { background: var(--color-accent); color: #fff; cursor: default; animation: .5s wash-bounce; }

.wash-header-actions .wash-checkin-btn,.wash-header-actions .wash-checkin-btn:hover { color: var(--mc-peach-deep); border-color: var(--mc-peach); }

.wash-header-actions .wash-checkin-btn { font-size: .75rem; }

.wash-checkin-btn { align-items: center; gap: 4px; height: 30px; padding: 0 10px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); font-size: .75rem; cursor: pointer; font-family: var(--font-sans); }

.wash-header-actions .wash-checkin-btn:hover { background: var(--mc-peach-soft); transform: scale(1.12); }

.wash-header-actions .wash-checkin-btn.signed,.wash-header-actions .wash-checkin-btn.signed[data-streak]::after { background: var(--mc-peach-deep); color: #fff; }

.wash-checkin-btn .wash-ico { width: 14px; height: 14px; margin: 0; }

.wash-points-float { position: absolute; top: -8px; left: 50%; transform: translateX(-50%); font-size: .875rem; font-weight: 700; white-space: nowrap; pointer-events: none; animation: 1.5s forwards wash-float-up; }

@keyframes wash-float-up {
  0% { opacity: 1; transform: translateX(-50%) translateY(0); }
  100% { opacity: 0; transform: translateX(-50%) translateY(-30px); }
}

@keyframes wash-bounce {
  0%,100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}

.wash-header-actions .wash-checkin-btn.signed[data-streak]::after { content: attr(data-streak); position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px; padding: 0 3px; border-radius: var(--radius-full); font-size: 10px; line-height: 16px; text-align: center; box-sizing: border-box; }

#wash-checkin-slot { display: flex; align-items: center; }

.wash-header-actions .wash-checkin-btn { height: 36px; display: inline-flex; align-items: center; box-sizing: border-box; width: 36px; padding: 0; justify-content: center; border-radius: var(--radius-full); position: relative; }

.wash-header-actions .wash-checkin-btn.signed { border-color: var(--mc-peach-deep); }

.wash-header-actions .wash-checkin-btn .wash-ico { margin: 0; width: 20px; height: 20px; }

.wash-header-actions .wash-checkin-btn:not(.signed) { animation: 2s ease-in-out infinite wash-checkin-breathe; }

.wash-header-actions .wash-checkin-btn:not(.signed):hover .wash-ico { animation: .6s wash-gift-wiggle; }

@media (prefers-reduced-motion:reduce) {
  .wash-header-actions .wash-checkin-btn,.wash-header-actions .wash-checkin-btn .wash-ico { animation: none; }
}
