/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

[data-bridge-components~="button"]
[data-controller~="bridge--button"] {
  display: none !important;
}

@keyframes bounce-short {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: translateY(0);
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}

.animate-bounce-short {
  animation: bounce-short 1s ease-in-out 3;
}

/* ตัวอย่างเพิ่มเอฟเฟกต์อื่น ๆ */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.animate-fadeIn {
  animation: fadeIn 0.5s ease-in forwards;
}

@keyframes slideUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.animate-slideUp {
  animation: slideUp 0.5s ease-out forwards;
}

@keyframes blink-fast {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

.animate-blink-fast {
  animation: blink-fast 0.3s ease-in-out 4;
}