/* ============================================================
   LA PRESA — bitacora.css (T19 · La Bitácora; T22 restyle)
   The measured side is neutral on purpose: a number a person
   measured is always --ink, never a mood colour. No animation:
   between the two taps the screen is still (p7 #06, p19).
   Sober for this surface alone = data-sober on .bit / the row.
   ============================================================ */

/* The one live region, kept outside the screen host (visually hidden). */
.bit-vivo {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.bit-card p, .bit-linea { font-size: 16px; line-height: 1.5; color: var(--ink); }
.bit-card p + p { margin-top: 8px; }
.bit-card .bit-nota, .bit-nota { font-size: 13px; line-height: 1.45; color: var(--ink-dim); }
.btn-block + .bit-nota { margin-top: 10px; }
.bit-centro { text-align: center; }
.bit-pie { margin: 12px 4px 0; }
.bit-card .bit-msg, .bit-msg { margin-top: 8px; font-size: 14px; color: var(--ink); font-weight: 700; }
.bit-msg:empty { display: none; }

.bit-ejemplo, .bit-aviso {
  margin-top: 12px; padding: 12px 14px; font-size: 15px; line-height: 1.45; color: var(--ink);
  border: 1px dashed var(--line-campo); border-radius: var(--r-md); background: var(--surface);
}
.bit-aviso { border: 1px solid var(--line); background: var(--soft); }

/* ---- the quiet screen of a live trip (p7 #06): one still page ---- */
#app[data-quieto] .screen.active { animation: none; }
.bit-quieto {
  display: flex; flex-direction: column;
  min-height: calc(100svh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
}
@media (min-width: 720px) { .bit-quieto { min-height: calc(100svh - 88px); } } /* inside the framed #app */
.bit-q { flex: 1; }
.bit-quieto > * + .bit-q { margin-top: 16px; }
/* the trip's one chip, top left, 12/28 as drawn (T24 #42: no SIMULACIÓN chip here) */
.bit-q-sellos { display: flex; flex-wrap: wrap; gap: 8px; }
.bit-q .sello { font-size: 12px; min-height: 28px; }
.bit-q .pantalla-titulo { margin-top: 19px; }
.bit-q-tit { margin-top: 62px; font-size: 23px; font-weight: 700; line-height: 1.3; color: var(--ink-strong); }
.bit-q-sub { margin-top: 9px; font-size: 18px; color: var(--ink-dim); }
.bit-q > .bit-nota { margin-top: 12px; }
.bit-otras .bit-nota { margin-top: 8px; }
.bit-q-pie { margin-top: 24px; text-align: center; }

/* The measured number: neutral ink in every register. */
.bit-num {
  font-size: 65px; font-weight: 700; line-height: 1.05;
  color: var(--ink); font-variant-numeric: tabular-nums; margin: 10px 0 6px;
}
.bit-num-u { font-size: 24px; }
/* 360 x 640 (p18): the result's buttons clear the tab bar */
@media (max-height: 700px) { .bit-resultado .bit-num { font-size: 48px; margin-top: 4px; } #scr-bitacora:has(.bit-resultado) .pantalla-sub { display: none; } }
.bit-simulado { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); color: var(--ink-dim); }
.bit-acciones { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.bit-acciones .btn { flex: 1 1 auto; }

.bit-pills { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.bit-pills .btn { flex: 1 1 auto; }
[data-sober="true"] .bit-pills { filter: grayscale(1); }
.bit-radio {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px;
  border: 1px solid var(--line-campo); border-radius: var(--r-full); font-size: 15px; color: var(--ink);
}
.bit-check { display: flex; gap: 10px; align-items: center; margin-top: 12px; min-height: 44px; font-size: 15px; color: var(--ink); }
.bit-check input, .bit-radio input { width: 20px; height: 20px; flex: 0 0 auto; accent-color: var(--brand); }

/* One level down: folded by default. */
.bit-det { border-top: 1px solid var(--line); margin-top: 12px; }
.bit-det summary {
  cursor: pointer; min-height: 44px; display: flex; align-items: center; gap: 8px;
  font-size: 16px; font-weight: 700; color: var(--ink); list-style: none;
}
.bit-det summary::-webkit-details-marker { display: none; }
.bit-det summary::before { content: '+'; width: 14px; color: var(--ink-dim); }
.bit-det[open] > summary::before { content: '−'; }
.bit-det[open] { padding-bottom: 4px; }
.bit-q .bit-otras { margin-top: 8px; border-top: 0; }
.bit-otras > summary { font-size: 15px; text-decoration: underline; }
.bit-q .bit-otras > summary::before { content: none; }
/* inside the one fold: plain groups, nothing folded twice */
.bit-grupo { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.bit-grupo > .btn-block:first-child { margin-top: 0; }
.bit-grupo-tit { font-weight: 700; color: var(--ink); }

/* Cover rows. */
.bit-fila .bit-linea { margin: 0; }
.bit-fila .sello { margin-bottom: 8px; }
/* Every Bitácora link is a 44 px tap target (cover rows, teaser, Mi Presa). */
.bit-enlace { display: inline-block; min-height: 44px; padding: 12px 0; }
.bit-fila .bit-enlace { margin-bottom: -10px; font-size: 15px; }
.bit-fila-libre { display: flex; align-items: center; gap: 12px; }
/* Idle row: title and note are ONE link (a block as tall as both lines). */
.bit-fila-libre .bit-fila-txt {
  display: block; flex: 1 1 auto; min-width: 0; margin: 0; padding: 4px 0;
}
.bit-fila-tit { display: block; font-size: 16px; font-weight: 700; }
.bit-fila-libre .bit-nota { display: block; margin-top: 2px; font-weight: 400; }
.bit-fila-libre > .btn { flex: none; padding: 0 22px; }
/* The teaser: one quiet line, not a second card (p6 #2). */
.bit-pista { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.bit-pista .bit-enlace { flex: 1 1 auto; min-width: 0; color: var(--ink-dim); font-weight: 400; }
.bit-x {
  flex: 0 0 auto; width: 44px; height: 44px; border: 0; background: transparent;
  color: var(--ink-dim); font-size: 16px; font-family: inherit; cursor: pointer; border-radius: 12px;
}

/* The list. */
.bit-card .bit-normal { font-size: 15px; margin-bottom: 4px; }
.bit-viaje {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 56px; padding: 10px 0;
  background: transparent; border: 0; border-top: 1px solid var(--line);
  color: var(--ink); font-family: inherit; text-align: left; cursor: pointer;
}
.bit-v-dur { flex: 0 0 90px; font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; }
.bit-v-info { flex: 1 1 auto; min-width: 0; font-size: 14px; line-height: 1.35; }
.bit-v-info small { display: block; font-size: 13px; color: var(--ink-dim); }
.bit-v-ir { flex: 0 0 auto; color: var(--ink-dim); }

/* The apunte: plain text, nothing that looks official. */
.bit-pre {
  white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--font-sans);
  font-size: 14px; line-height: 1.5; color: var(--ink);
  background: var(--soft); border-radius: var(--r-sm); padding: 12px; margin-bottom: 10px;
}
