/* OWNER: Aura. Phone fit at 375, 390 and 430. Loaded last. Does not rewrite design.css. */
/* Fixes that need a js owner are listed at the bottom of this file. */

@media (max-width: 767px) {
  html, body {
    overflow-x: hidden;
  }

  input, select, textarea {
    font-size: 16px;
  }

  .main {
    padding-top: env(safe-area-inset-top, 0px);
  }

  .pin {
    padding: calc(24px + env(safe-area-inset-top, 0px)) 24px calc(24px + env(safe-area-inset-bottom, 0px));
  }

  .toast {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 88px);
  }

  .theme-btn {
    min-width: 44px;
    min-height: 44px;
    height: 44px;
  }

  .book-seg .btn {
    min-height: 44px;
  }

  .book-chips .btn {
    min-height: 44px;
  }

  .book-open {
    min-height: 44px;
  }

  .book-item {
    min-height: 44px;
  }

  .book-depth-chips .btn {
    min-height: 44px;
  }

  .book-meta-link { position: relative; } /* Sophie, Sep 25: inline-flex broke the sentence, so the tap target grows invisibly instead */
  .book-meta-link::after { content: ""; position: absolute; left: 0; right: 0; top: -14px; bottom: -14px; }

  .more-row {
    min-height: 44px;
  }

  .td-attn .btn {
    min-height: 44px;
  }

  .set-steps .btn {
    min-height: 44px;
  }

  .set-x {
    min-width: 44px;
    min-height: 44px;
    padding: 10px;
  }

  .book-head,
  .book-tools,
  .row {
    max-width: 100%;
  }

  .sheet {
    max-height: 90svh;
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + env(keyboard-inset-bottom, 0px));
  }

  .sheet-foot {
    flex: 0 0 auto;
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: var(--surface);
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  }

  .sheet-body {
    padding-bottom: 12px;
  }
}

/* V3 type floors, Oct 3 2026 (measured, see docs/notify-look/v3-type.md). The tab bar labels were 11 px and the avatar initials 10 and 11 px;
   a bare <small> was the browser default 10.8 px. Sophie may fold these three rules into design.css at integration. */
@media (max-width: 767px) { .nav-item { font-size: 12px; } }
.book-av { font-size: 12px; }
.book-chips .book-av { font-size: 11px; }
small { font-size: var(--fs-chip); }

/*
  Needs a js owner, not this file:
  1. Book grid slots and cards stay at --slot 24px (Charlie, design.css). A 15 minute
     visit is a 24px target on purpose so a nine hour day fits. Do not raise --slot here.
  2. Shared sheets: iOS Safari draws the keyboard over the layout viewport, so Save
     can sit behind it. visualViewport offset belongs in js/app.js or the sheet owner.
  3. #/install is unknown to the KNOWN list in js/app.js. install.js overlays the
     screen if Sophie has not added 'install' yet. Add it when wiring index.html.
*/