/* Small fixes from the Oct 30 app review. Loaded after every other stylesheet. */

/* Family Faith now sits in the main group after Calendar: no divider line above it. */
nav button[data-page="discipleship"],
html[data-look] nav button[data-page="discipleship"] { border-top: 0 !important; margin-top: 0 !important; border-radius: 12px; }

/* Settings and Music: card titles in Young Serif, like the rest of the app. */
.settings-panel .card h2, .settings-section h2, .music-page .card h2, #content .card.settings-section h2 { font-family: 'Young Serif', Georgia, serif; font-weight: 400; }
.settings-nav button { gap: 0; }
.settings-nav .sg-icon { display: none; }
.field-hint { display: block; font-size: 13px; line-height: 1.5; color: #5b6068; font-weight: 400; margin: 4px 0 2px; }

/* Help & Feedback */
.help-actions .help-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; min-height: 44px; padding: 0 20px; border-radius: 999px; font-weight: 700; flex: 0 1 auto; }
.help-actions .help-link.outline { border: 1.5px solid currentColor; }
.help-q { border-top: 1px solid #ece5d9; padding: 12px 0; }
.help-q summary { cursor: pointer; font-weight: 700; }
.help-q p { margin: 8px 0 0; line-height: 1.6; color: #50565e; }

/* Music: the playlist settings fold away under one button. */
.music-change > summary { cursor: pointer; font: 400 22px 'Young Serif', Georgia, serif; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.music-change > summary::-webkit-details-marker { display: none; }
.music-change > summary::after { content: "+"; font: 800 22px Urbanist, 'DM Sans', sans-serif; color: var(--blue, #0a60a2); }
.music-change[open] > summary::after { content: "–"; }
.music-change[open] .music-where { margin: 16px 0 20px; }

/* Today: the date and the verse each show once (the faith card has the reading). */
body.board-screen #content > .intro .date-chip,
body.board-screen #content > .intro > div > p { display: none; }

/* Bucket List: a small check instead of a big blue button on every item. */
.bucket-actions button[data-bucketdone] { background: transparent !important; color: var(--blue, #0a60a2) !important; border: 1.5px solid #bcd3e6 !important; box-shadow: none !important; min-height: 36px; padding: 0 14px; font-size: 13px; }

/* Journal: the waiting moments use quieter buttons. */
.jb-draft-actions .primary { background: transparent !important; color: var(--blue, #0a60a2) !important; border: 1.5px solid #bcd3e6 !important; box-shadow: none !important; }

/* The More menu's board buttons (only phones see More). */
.more-boards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 6px 0 14px; }
.more-boards .outline { margin: 0; width: 100%; min-height: 48px; }

/* Reminder banner: slimmer, no bell. */
.reminder-banner { align-items: center; padding: 10px 12px 10px 16px; max-width: 360px; }
.reminder-banner[hidden] { display: none !important; }

@media (max-width: 760px) {
  /* Phones: the boards live in More, so the top bar has room to breathe. */
  .top-actions #kidsBoardButton, .top-actions #boardMode { display: none !important; }
  /* Bottom bar labels: short, and the same words as the menu. */
  nav button[data-page] span { font-size: 0 !important; }
  nav button[data-page] span::after { font-size: 10px !important; }
  nav button[data-page="board"] span::after { content: "Today" !important; }
  nav button[data-page="calendar"] span::after { content: "Calendar" !important; }
  nav button[data-page="discipleship"] span::after { content: "Faith" !important; }
  nav button[data-page="chores"] span::after { content: "Chores" !important; }
  nav button[data-page="todos"] span::after { content: "To-Do" !important; }
  nav button[data-page="meals"] span::after { content: "Meals" !important; }
  nav button[data-page="journal"] span::after { content: "Journal" !important; }
  nav button[data-page="adventures"] span::after { content: "Bucket List" !important; }
  nav button[data-page="album"] span::after { content: "Photos" !important; }
  nav button[data-page="music"] span::after { content: "Music" !important; }
  /* The reminder banner sits above the bottom bar instead of on top of it. */
  .reminder-banner { left: 12px; right: 12px; max-width: none; bottom: calc(var(--btw-nav-h, 76px) + 10px + env(safe-area-inset-bottom)); }
}

/* Family Board: a little room above the date so it isn't cut off on a 1024 × 768 tablet;
   reminders stay off the boards. */
body.wall .fb-head { padding-top: 14px; }
body.wall #reminderBanner, body.kids-mode #reminderBanner { display: none !important; }