/* ─── Vhcles — Custom Styles ─── */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* FOUC Prevention */
body { opacity: 0; transition: opacity 0.4s ease-in-out; }
body.loaded { opacity: 1; }

/* Timeline entrance animation */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate-fade-in-up {
  animation: fadeInUp 0.5s ease-out forwards;
}

/* Staggered children */
.stagger-children > * {
  opacity: 0;
  animation: fadeInUp 0.4s ease-out forwards;
}
.stagger-children > *:nth-child(1) { animation-delay: 0.05s; }
.stagger-children > *:nth-child(2) { animation-delay: 0.10s; }
.stagger-children > *:nth-child(3) { animation-delay: 0.12s; }
.stagger-children > *:nth-child(4) { animation-delay: 0.16s; }
.stagger-children > *:nth-child(5) { animation-delay: 0.20s; }
.stagger-children > *:nth-child(6) { animation-delay: 0.24s; }
.stagger-children > *:nth-child(7) { animation-delay: 0.28s; }
.stagger-children > *:nth-child(8) { animation-delay: 0.32s; }
.stagger-children > *:nth-child(9) { animation-delay: 0.36s; }
.stagger-children > *:nth-child(10){ animation-delay: 0.40s; }

/* Select arrow hide (we use custom chevron) */
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }

/* Focus ring reset */
*:focus { outline: none; }

/* Scrollbar styling */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }

/* Toast / success notification */
@keyframes slideInFromTop {
  from { opacity: 0; transform: translateY(-20px); }
  to   { opacity: 1; transform: translateY(0); }
}
.toast-enter {
  animation: slideInFromTop 0.3s ease-out forwards;
}
@keyframes slideOutToTop {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-20px); }
}
.toast-exit {
  animation: slideOutToTop 0.25s ease-in forwards;
}

/* Windows Flag Emoji Polyfill */
@font-face {
  font-family: "Twemoji Country Flags";
  unicode-range: U+1F1E6-1F1FF, U+1F3F4, U+E0062-E0063, U+E0065-E0067, U+E006C, U+E006E, U+E0073-E0074, U+E0077, U+E007F;
  src: url("https://cdn.jsdelivr.net/npm/country-flag-emoji-polyfill@0.1.8/dist/TwemojiCountryFlags.woff2") format("woff2");
  font-display: swap;
}

.font-flags {
  font-family: "Twemoji Country Flags", "Inter", sans-serif !important;
}
