/* PrintConnect — shared styles layered on top of Tailwind (CDN). */

:root {
  --pb-brand: #4f46e5;
  --pb-brand-600: #4338ca;
}

html { scroll-behavior: smooth; }
body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }

/* Toasts */
.pb-toast {
  position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 20px);
  padding: 12px 18px; border-radius: 12px; color: #fff; font-size: 14px; font-weight: 500;
  box-shadow: 0 10px 30px rgba(0,0,0,.25); opacity: 0; transition: all .3s ease; z-index: 9999; max-width: 90vw;
}
.pb-toast.show { transform: translate(-50%, 0); opacity: 1; }
.pb-toast-ok { background: #0f766e; }
.pb-toast-error { background: #dc2626; }

/* Glassmorphism card */
.pb-glass {
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  border: 1px solid rgba(255,255,255,.5);
}
.dark .pb-glass {
  background: rgba(17,24,39,.65);
  border-color: rgba(255,255,255,.08);
}

/* Animated gradient hero blob */
@keyframes pb-float { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-18px) rotate(6deg); } }
.pb-float { animation: pb-float 8s ease-in-out infinite; }

/* Reveal on load */
@keyframes pb-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
.pb-rise { animation: pb-rise .7s cubic-bezier(.22,1,.36,1) both; }

/* Skeleton shimmer */
@keyframes pb-shimmer { 0% { background-position: -400px 0; } 100% { background-position: 400px 0; } }
.pb-skeleton { background: linear-gradient(90deg,#e5e7eb 25%,#f3f4f6 50%,#e5e7eb 75%); background-size: 800px 100%; animation: pb-shimmer 1.3s infinite; }
.dark .pb-skeleton { background: linear-gradient(90deg,#1f2937 25%,#374151 50%,#1f2937 75%); background-size: 800px 100%; }

/* focus ring */
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 2px solid var(--pb-brand); outline-offset: 2px;
}