/* Biweekly pay schedule (/biweekly-pay-schedule/). Builds on .hmbd-tool / .hmbd-table in hmbd.css. */
.hmbd-bw-fields { display: grid; align-items: end; grid-template-columns: repeat(auto-fit, minmax(9.5em, 1fr)); gap: 0.75em 1em; margin: 0 0 1em; }
.hmbd-bw-field { display: flex; flex-direction: column; gap: 0.3em; min-width: 0; }
.hmbd-bw-fields label { font-weight: 600; font-size: 0.9em; }
.hmbd-tool .hmbd-bw-fields input, .hmbd-tool .hmbd-bw-fields select { flex: 0 0 auto; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
@media (max-width: 480px) { .hmbd-bw-fields { grid-template-columns: minmax(0, 1fr); } }
#bw-result > p { margin: 0 0 0.8em; }
.hmbd-bw-months { display: grid; grid-template-columns: repeat(auto-fill, minmax(14.5em, 1fr)); gap: 0.9em; }
.hmbd-bw-cal { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.88em; background: var(--ast-global-color-5); border: 1px solid var(--ast-global-color-6); border-radius: 4px; margin: 0; }
.hmbd-bw-cal caption { font-weight: 600; text-align: left; padding: 0 0 0.3em; }
.hmbd-bw-cal th, .hmbd-bw-cal td { text-align: center; padding: 0.3em 0; line-height: 1.5; }
.hmbd-bw-cal th { font-weight: 600; color: var(--ast-global-color-3); }
.hmbd-bw-cal td.hol { color: #a33; text-decoration: underline dotted; }
.hmbd-bw-cal td.pay { background: var(--ast-global-color-0); color: #fff; font-weight: 700; border-radius: 4px; text-decoration: none; }
.hmbd-bw-cal td.pay.moved { background: #b45309; }
.hmbd-bw-cal td.skip { text-decoration: line-through; color: var(--ast-global-color-3); }
.hmbd-bw-cal time { color: inherit; }
.hmbd-bw-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hmbd-bw-legend { display: flex; flex-wrap: wrap; gap: 0.4em 1.2em; font-size: 0.88em; margin: 0.9em 0 0; }
.hmbd-bw-legend span::before { content: ""; display: inline-block; width: 0.9em; height: 0.9em; margin-right: 0.35em; vertical-align: -0.1em; border-radius: 2px; }
.hmbd-bw-legend .k-pay::before { background: var(--ast-global-color-0); }
.hmbd-bw-legend .k-moved::before { background: #b45309; }
.hmbd-bw-legend .k-hol::before { border-bottom: 2px dotted #a33; }
.hmbd-bw-legend .k-skip::before { background: linear-gradient(to bottom right, transparent 45%, var(--ast-global-color-3) 45%, var(--ast-global-color-3) 55%, transparent 55%); }
.hmbd-bw-ab td:first-child { white-space: nowrap; }
/* Phones: two compact months per row (from a 360px screen) instead of one 230px-tall month per
   row; all 12 months stay in the page, readable at 13px, and nothing depends on the script. */
@media (max-width: 544px) {
  .hmbd-bw-months { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 0.8em 0.6em; }
  .hmbd-bw-cal { font-size: 13px; }
  .hmbd-bw-cal caption { font-size: 14px; padding-bottom: 0.2em; }
  .hmbd-bw-cal th, .hmbd-bw-cal td { padding: 0.12em 0; line-height: 1.5; }
  .hmbd-bw-cal td.pay { border-radius: 3px; }
}