/* ShiftDeduct — Custom Styles */

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

/* Custom scrollbar for dark mode */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #0f172a; /* slate-900 */
}
::-webkit-scrollbar-thumb {
  background: #334155; /* slate-700 */
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #475569; /* slate-600 */
}

/* Loading spinner */
.spinner {
  border: 3px solid rgba(255, 255, 255, 0.1);
  border-left-color: #14b8a6; /* teal-500 */
  border-radius: 50%;
  width: 24px;
  height: 24px;
  animation: spin 0.6s linear infinite;
  display: inline-block;
}

/* Small inline spinner for buttons */
button .spinner {
  width: 16px;
  height: 16px;
  border-width: 2px;
  vertical-align: middle;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* Flash message slide-in */
[role="alert"] {
  animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Print styles — Tax Forms checklist */
@media print {
  nav,
  footer,
  .print-hide {
    display: none !important;
  }
  body {
    background: #fff !important;
    color: #000 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  main {
    padding: 0 !important;
  }
  .print-card {
    background: #fff !important;
    border: 1px solid #ccc !important;
    color: #000 !important;
  }
  .print-card h4,
  .print-card span {
    color: #000 !important;
  }
  .print-card p {
    color: #333 !important;
  }
  .print-notes {
    background: #f9f9f9 !important;
    border: 1px solid #ccc !important;
  }
  .print-notes h3 {
    color: #0d9488 !important;
  }
  .print-notes p {
    color: #333 !important;
  }
}

/* ─── PWA / Mobile UX Improvements ──────────────────────────── */

/* Prevent iOS input zoom */
input[type="text"],
input[type="email"],
input[type="number"],
input[type="date"],
select,
textarea {
  font-size: 16px !important;
}

/* Better touch targets */
button,
a {
  min-height: 44px;
}

/* Safe area for notched phones */
.pb-safe {
  padding-bottom: env(safe-area-inset-bottom);
}