/* The journal screen: the notes layout (notes.css), plus a small calendar. */
.filter-row { display: flex; gap: 8px; align-items: center; }
.filter-row select { flex: 1; }

.cal-head { display: flex; align-items: center; justify-content: space-between; font-weight: 600; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.cal-wd { color: var(--soft); font-size: 12px; padding: 2px 0; }
.cal-day {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 40px; padding: 2px 0;
  border: 0; border-radius: 10px; background: transparent; color: var(--ink);
  font-size: 15px; line-height: 1.1;
}
.cal-day:hover { background: var(--card); }
.cal-day.today span:first-child { color: var(--accent); font-weight: 700; }
.cal-day.on { background: var(--accent-soft); }
.cal-count { color: var(--accent); font-size: 11px; min-height: 12px; }
.cal-day:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }

.day-head { display: flex; align-items: center; gap: 4px; margin-top: 4px; }
.day-head h2 { flex: 1; margin: 0; text-align: center; font: 600 20px/1.2 var(--serif); text-transform: none; letter-spacing: 0; color: var(--ink); }
#go-today { align-self: center; font-size: 15px; }
.past-h { margin: 8px 0 0; color: var(--soft); font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
#day-list, #past-list { overflow: visible; }

.when { margin: 8px 0 0; color: var(--soft); font-size: 15px; }
.meta { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.meta select, .meta input {
  padding: 6px 10px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--card); color: var(--ink); font: inherit; font-size: 15px;
}
.meta input { min-width: 0; flex: 1; max-width: 240px; }
.meta select:focus, .meta input:focus { outline: 2px solid var(--accent); border-color: transparent; }

.add-journal { display: flex; gap: 8px; margin-top: 16px; }
#journals-list .link.danger { flex: none; }