/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

/* Alert auto-dismiss animations */
@keyframes fadeOutAlert {
  0% { opacity: 1; transform: translateY(0); }
  90% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(20px); visibility: hidden; }
}

.animate-success-dismiss {
  animation: fadeOutAlert 4.5s ease-in-out forwards;
}

.animate-error-dismiss {
  animation: fadeOutAlert 6.5s ease-in-out forwards;
}

/* Widget scrollbar hiding */
.hide-scrollbar {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;  /* Chrome, Safari, Opera */
}

/* Momentum chip entrance animation */
[data-controller="momentum"] .w-12 {
  animation: fadeInMomentum 0.8s ease-out;
}
@keyframes fadeInMomentum {
  from { opacity: 0; transform: translateY(8px) scale(0.9); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Subtle continuous pulse for momentum */
@keyframes pulse-subtle {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
    box-shadow: 0 0 0 0 rgba(156, 163, 175, 0.4);
  }
  50% {
    transform: scale(1.5);
    opacity: 0.9;
    box-shadow: 0 0 0 6px rgba(156, 163, 175, 0);
  }
}
.animate-pulse-subtle {
  animation: pulse-subtle 2.5s ease-in-out infinite;
}

/* iOS PWA Safe Area Support */
/* Only add safe area when in standalone mode (installed PWA) */
@media (display-mode: standalone) {
  /* Add top safe area padding to prevent content behind status bar */
  .min-h-screen {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }

  /* PWA install button positioning with safe area */
  .btn-circle.fixed {
    bottom: calc(1.5rem + env(safe-area-inset-bottom));
    right: calc(1.5rem + env(safe-area-inset-right));
  }
}

/* Money peek animation - subtle premium effect */
.money-peek {
  transition: opacity 160ms ease;
}
.money-peek.masked {
  opacity: 0.75;
}