:root{
  --bg: #F7F7F8;
  --surface: #F3F4F6;
  --muted: rgba(17,24,39,0.08);
  --heading: #0f172a;
  --muted-text: #6B7280;
  --cta-bg: #111827;
  --cta-ring: rgba(17,24,39,0.16);
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
}

@layer base {
  input:-webkit-autofill {
    transition: background-color 9999s ease-in-out 0s;
    -webkit-text-fill-color: inherit !important;
    caret-color: inherit !important;
  }

  /* Force transparent background for autofill */
  input:-webkit-autofill,
  input:-webkit-autofill:focus,
  input:-webkit-autofill:hover {
    background-color: transparent !important;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
    box-shadow: 0 0 0px 1000px transparent inset !important;
  }
}


body{font-family:var(--font-sans);background:var(--bg);}

.font-poppins{font-family:'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;}

.shadow-pill{box-shadow: 0 10px 25px rgba(15,23,42,0.06);}
.shadow-subtle{box-shadow: 0 6px 18px rgba(15,23,42,0.04);}

:focus{outline:none}
button:focus, input:focus{box-shadow:0 0 0 3px var(--cta-ring); border-radius:9999px}

/* Ensure the carousel track won't break on small screens */
.carousel-track { align-items: stretch; }
/* Prevent images inside cards from shrinking */
.carousel-item img { max-width: 100%; height: auto; display: block; }
/* Accessibility helpers */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Notifications animations */
@keyframes slide-in-up {
  from { transform: translateY(20px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}
@keyframes slide-out-down {
  from { transform: translateY(0); opacity: 1; }
  to   { transform: translateY(20px); opacity: 0; }
}
.notify-in { animation: slide-in-up 320ms cubic-bezier(.22,.9,.28,1) forwards; }
.notify-out { animation: slide-out-down 280ms ease forwards; }

/* make notifications clickable while allowing container pointer-events:none */
#notifications > * { pointer-events: auto; }