/* Tailwind is compiled into tailwind.css; this file holds the mobile shell primitives. */

html, body { height: 100%; overscroll-behavior-y: none; }

/* Inputs must be >= 16px or iOS Safari zooms on focus. */
input, select, textarea { font-size: 16px; }

/* Full-height shell using dynamic viewport units; --vvh is set from visualViewport when the keyboard opens. */
.app-shell {
  display: flex;
  flex-direction: column;
  height: var(--vvh, 100dvh);
  padding-top: env(safe-area-inset-top);
  /* Leave room for the fixed tab bar (56px) + home indicator on mobile. */
  padding-bottom: calc(3.5rem + env(safe-area-inset-bottom));
  box-sizing: border-box;
}
/* While the on-screen keyboard is up (set by the viewport controller): the tab bar and the home-indicator padding are
   hidden behind it, so give that room back. On Home the header and suggestion chips go too, so the thread gets the space. */
.keyboard-open .app-shell { padding-bottom: 0; }
.keyboard-open #tab-bar { display: none; }
.keyboard-open .app-shell:has([data-controller~="chat"]) > header { display: none; }
.keyboard-open [data-keyboard-hide] { display: none; }
.app-main { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }

@media (min-width: 768px) {
  .app-shell { padding-bottom: 0; }
  .app-main { max-width: 42rem; margin: 0 auto; width: 100%; }
  .app-main.app-main-wide { max-width: 80rem; } /* the week calendar needs room for 7 columns */
}

/* FullCalendar: match the app (green accent, big tap targets, status styling). */
.fc {
  --fc-border-color: #e2e8f0;
  --fc-button-bg-color: #047857;
  --fc-button-border-color: #047857;
  --fc-button-hover-bg-color: #065f46;
  --fc-button-hover-border-color: #065f46;
  --fc-button-active-bg-color: #064e3b;
  --fc-button-active-border-color: #064e3b;
  --fc-today-bg-color: rgb(236 253 245 / 0.7);
  --fc-now-indicator-color: #ef4444;
  --fc-page-bg-color: #fff;
  font-size: 0.95rem;
}
.fc .fc-button { min-height: 44px; min-width: 44px; padding: 0 0.9rem; font-size: 1rem; }
.fc .fc-toolbar { flex-wrap: wrap; gap: 0.5rem; }
.fc .fc-toolbar-title { font-size: 1.15rem; font-weight: 700; }
.fc .fc-event { cursor: pointer; }
.fc .fc-event.fc-status-cancelled { opacity: 0.5; text-decoration: line-through; }
.fc .fc-event.fc-status-completed { opacity: 0.8; }
.fc a { color: inherit; }