/* FlexyCare Connect — custom styles layered on top of Tailwind CDN.
   Keep this lean; Tailwind utilities do most of the work. */

:root {
  --brand: #00A99D;
  --brand-600: #00897B;
  --brand-700: #00695C;
  --accent: #4CAF50;
  --ink: #263238;
  --mist: #F5F7FA;
}

html { -webkit-tap-highlight-color: transparent; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* Respect the iOS safe area for the bottom navigation. */
.safe-bottom { padding-bottom: env(safe-area-inset-bottom); }
.pb-safe-nav { padding-bottom: calc(4.25rem + env(safe-area-inset-bottom)); }

/* Tidy scrollbars on desktop. */
@media (min-width: 1024px) {
  .fc-scroll::-webkit-scrollbar { width: 10px; height: 10px; }
  .fc-scroll::-webkit-scrollbar-thumb { background: #cdd9d7; border-radius: 999px; border: 3px solid transparent; background-clip: content-box; }
  .fc-scroll::-webkit-scrollbar-thumb:hover { background: #aac4c0; background-clip: content-box; }
  .fc-scroll::-webkit-scrollbar-track { background: transparent; }
}

/* Bottom nav active indicator. */
.fc-tab { transition: color .18s ease, transform .18s ease; }
.fc-tab[data-active="1"] { color: var(--brand-700); }
.fc-tab[data-active="1"] .fc-tab-dot { opacity: 1; transform: translateY(0) scale(1); }
.fc-tab-dot { opacity: 0; transform: translateY(4px) scale(.6); transition: opacity .2s ease, transform .2s ease; }

/* Sidebar link states. */
.fc-side-link { transition: background .15s ease, color .15s ease; }
.fc-side-link[data-active="1"] { background: var(--brand); color: #fff; box-shadow: 0 8px 22px -10px rgba(0,105,92,.55); }
.fc-side-link[data-active="1"] svg { color: #fff; }

/* Soft entrance for cards/pages. */
@keyframes fc-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.fc-rise { animation: fc-rise .4s ease both; }
.fc-rise-1 { animation-delay: .04s; }
.fc-rise-2 { animation-delay: .08s; }
.fc-rise-3 { animation-delay: .12s; }
.fc-rise-4 { animation-delay: .16s; }

/* Pulse for the SOS button. */
@keyframes fc-pulse { 0% { box-shadow: 0 0 0 0 rgba(239,68,68,.45); } 70% { box-shadow: 0 0 0 16px rgba(239,68,68,0); } 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0); } }
.fc-sos { animation: fc-pulse 2s infinite; }

/* Notification dropdown + drawer transitions. */
.fc-pop { transform-origin: top right; }
.fc-pop[hidden] { display: none; }

/* Chat bubbles. */
.fc-bubble { max-width: 78%; word-wrap: break-word; }

/* Skeleton shimmer for AJAX loads. */
.fc-skel { background: linear-gradient(90deg,#eef2f1 25%,#e2e9e7 37%,#eef2f1 63%); background-size: 400% 100%; animation: fc-shimmer 1.3s ease infinite; }
@keyframes fc-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* Print: hide chrome, show only the content. */
@media print {
  .no-print, .fc-sidebar, .fc-topbar, .fc-bottomnav { display: none !important; }
  .fc-main { padding: 0 !important; }
  body { background: #fff !important; }
}