/* Yore Tools: printable benefit payment calendar. Screen = large-print preview; print = one
   US Letter page, landscape, sized by printable.js through --ypc-* custom properties. */

/* ---------- tick list */
.ypc-controls { margin: 0 0 32px; }
.ypc-picks__h { margin: 18px 0 8px; font: 650 14px/1.3 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.ypc-picks__h:first-child { margin-top: 0; }
.ypc-picks__grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.ypc-pick { font-size: 17px; }
.ypc-pick .ypc-tag { flex: 0 0 auto; }
.ypc-pick__name { min-width: 0; }
.ypc-print { font-size: 19px; min-height: 58px; padding-inline: 28px; }
.ypc-howto { margin: 14px 0 0; font-size: 16px; }
.ypc-warn { margin: 14px 0 0; font-size: 17px; }
.ypc-pages { margin: 18px 0 0; }
.ypc-range-opts { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.ypc-page + .ypc-page { margin-top: 40px; }
.ypc-page + .ypc-page .ypc-legend { display: none; }
.ypc-pg { font-weight: 500; }

.ypc-tag { display: inline-block; padding: 1px 7px; border-radius: 5px; background: var(--accent-wash); color: var(--accent-strong); font: 700 14px/1.35 var(--sans); text-decoration: none; letter-spacing: .01em; white-space: nowrap; cursor: default; }
abbr.ypc-tag { text-decoration: none; border: 0; }

/* ---------- the calendar (screen) */
.ypc-sheet { margin: 0 0 36px; }
.ypc-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; margin: 0 0 12px; }
.prose .ypc-title, .ypc-title { font: 600 clamp(24px, 3vw, 30px)/1.2 var(--serif); color: var(--ink); margin: 0; }
.ypc-range { margin: 0; font-weight: 600; color: var(--muted); font-size: 17px; }
.prose .ypc ul, .ypc ul { list-style: none; padding: 0; margin: 0; }
.prose .ypc li, .ypc li { margin: 0; }
.ypc-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0 0 22px !important; font-size: 16px; line-height: 1.4; }
.ypc-legend li { display: flex; align-items: baseline; gap: 6px; }
.ypc-months { display: grid; gap: 34px; }
.prose .ypc-m__h, .ypc-m__h { font: 600 24px/1.2 var(--serif); color: var(--ink); margin: 0 0 8px; }
.prose .ypc-t, .ypc-t { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 16px; line-height: 1.2; margin: 0; }
.prose .ypc-t th, .ypc-t th { min-width: 0; padding: 6px 0; background: none; border: 0; text-align: center; font: 650 14px/1.2 var(--sans); color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.ypc-t th abbr { text-decoration: none; }
.prose .ypc-t td, .ypc-t td { min-width: 0; height: 84px; padding: 5px 6px; border: 1px solid #cfd6cf; vertical-align: top; text-align: left; background: var(--paper); }
.prose .ypc-t tr:last-child > td { border-bottom: 1px solid #cfd6cf; }
.prose .ypc-t td.is-empty, .ypc-t td.is-empty { background: var(--wash); }
.ypc-d { display: block; font: 650 20px/1.1 var(--sans); color: var(--ink); margin-bottom: 4px; }
.ypc-t td.has-pay { background: var(--highlight); }
.ypc-t td.has-pay .ypc-d { color: var(--brand-strong); }
.ypc-l { display: flex; flex-wrap: wrap; gap: 3px; }
.ypc-l .ypc-tag { font-size: 13px; padding: 0 5px; white-space: normal; }
.ypc-t td.is-past { opacity: .45; }
.ypc-t td.is-today { box-shadow: inset 0 0 0 3px var(--accent); }
.ypc-list { display: none; }
.ypc-exp { color: var(--muted); font-size: .9em; }
.ypc-foot { margin: 20px 0 0; font-size: 15px; color: var(--muted); }

.ypc-none { margin: 0 0 32px; font-size: 17px; }
.ypc-none__h { font: 650 19px/1.3 var(--sans); color: var(--ink); margin: 0 0 8px; }
.prose .ypc-none li { margin: 0 0 8px; }
.ypc-after__lead { font: 600 21px/1.35 var(--serif); color: var(--ink); margin: 0 0 12px; }

/* Phones: squares are too small for labels, so paid days get a dot and a plain list follows each month. */
@media (max-width: 640px) {
	.prose .ypc-t td, .ypc-t td { height: 52px; padding: 3px; text-align: center; }
	.ypc-l { display: none; }
	.ypc-d { font-size: 18px; margin: 0; }
	.ypc-t td.has-pay .ypc-d { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--brand-strong); color: #fff; }
	.ypc-t td.has-pay { background: var(--paper); }
	.ypc-t th { font-size: 13px; letter-spacing: 0; }
	.ypc-list { display: block; margin: 12px 0 0 !important; font-size: 17px; line-height: 1.45; }
	.ypc-list li { padding: 8px 0; border-bottom: 1px solid var(--rule); }
	.ypc-list li.is-past { color: var(--muted); }
	.ypc-list__d { display: block; font-weight: 700; color: var(--ink); }
	.ypc-legend { display: none; }
	.ypc-print { width: 100%; }
}

/* ---------- hub */
.prose .ypc-hub__list, .ypc-hub__list { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.prose .ypc-hub__list li { margin: 0; }
.ypc-hub__lead { font-size: 19px; }
.ypc-hub__link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 12px 18px; border: 1.5px solid #c9d1ca; border-radius: 10px; background: var(--paper); color: var(--ink); text-decoration: none; }
.prose .ypc-hub__link { text-decoration: none; }
.ypc-hub__link:hover { border-color: var(--accent); background: var(--accent-wash); color: var(--ink); }
.ypc-hub__link:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.ypc-hub__name { font: 650 19px/1.25 var(--sans); }
.ypc-hub__meta { font-size: 15px; color: var(--muted); white-space: nowrap; }
.ypc-hub__how { margin: 0 0 16px; }
.ypc-hub__how p { margin: 0; }

/* ---------- print: one US Letter page, landscape, nothing but the calendar */
@page { size: letter landscape; margin: 0.35in; }
@media print {
	html, body { background: #fff !important; }
	body { zoom: 1 !important; margin: 0 !important; }
	.site-header, .site-footer, .article__aside, .crumbs, .skip, .toc-mobile, .yo-product, .yo-signup,
	ins, iframe, .adsbygoogle, [id^="google_ads"], [class*="mv-ad"], [id*="mv-ad"], [class*="ad-slot"] { display: none !important; }
	body:has(.ypc-sheet) > :not(main) { display: none !important; }
	body:has(.ypc-sheet) main > :not(:has(.ypc-sheet)) { display: none !important; }
	body:has(.ypc-sheet) main :has(> .entry-content .ypc-sheet) > :not(.entry-content) { display: none !important; }
	.entry-content:has(.ypc-sheet) > :not(.ypc) { display: none !important; }
	.ypc > :not(.ypc-sheet) { display: none !important; }
	body:has(.ypc-sheet) main, body:has(.ypc-sheet) main .wrap, body:has(.ypc-sheet) .page-article, .entry-content:has(.ypc-sheet), .ypc { margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; border: 0 !important; }

	.ypc { color: #000; font-size: 10pt; }
	.ypc-page.is-skip { display: none !important; }
	.ypc-page + .ypc-page { margin-top: 0; break-before: page; }
	.ypc-page + .ypc-page .ypc-legend { display: block !important; }
	.ypc-page { width: 10.3in; height: 7.8in; margin: 0 !important; display: flex; flex-direction: column; overflow: hidden; break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.ypc-head { flex: 0 0 auto; height: 0.5in; margin: 0; flex-wrap: nowrap; align-items: baseline; }
	.prose .ypc-title, .ypc-title { font: 700 21pt/1.1 var(--serif); color: #000; }
	.ypc-range { font: 650 13pt/1.1 var(--sans); color: #000; }
	.ypc-legend { display: block !important; flex: 0 0 auto; columns: 3; column-gap: 0.2in; margin: 0 0 0.12in !important; font: 400 9.5pt/1.3 var(--sans); color: #000; }
	.ypc-legend li { display: block; break-inside: avoid; }
	.ypc-legend .ypc-tag { font: 700 9.5pt/1.3 var(--sans); padding: 0 3pt; background: #e6e6e6; color: #000; border-radius: 2pt; }
	.ypc-months { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: repeat(var(--ypc-cols, 3), minmax(0, 1fr)); grid-template-rows: repeat(var(--ypc-rows, 1), minmax(0, 1fr)); gap: 0.16in 0.22in; }
	.ypc-m { display: flex; flex-direction: column; min-height: 0; break-inside: avoid; }
	.prose .ypc-m__h, .ypc-m__h { flex: 0 0 auto; height: 0.28in; margin: 0; font: 700 13.5pt/1 var(--serif); color: #000; }
	.prose .ypc-t, .ypc-t { flex: 1 1 auto; height: 100%; font-size: 9pt; }
	.prose .ypc-t th, .ypc-t th { height: 0.2in; padding: 0; font: 700 8pt/1 var(--sans); color: #000; letter-spacing: 0; }
	.prose .ypc-t td, .ypc-t td { height: auto; padding: 0.02in 0.03in; border: 0.75pt solid #444 !important; text-align: left; overflow: hidden; background: #fff; box-shadow: none !important; }
	.prose .ypc-t td.is-empty, .ypc-t td.is-empty { background: #f2f2f2; }
	.ypc-t td.has-pay { background: #e9e9e9 !important; }
	.ypc-t td.has-pay .ypc-d { display: block; width: auto; height: auto; background: none; color: #000; border-radius: 0; }
	.ypc-t td.is-past { opacity: .35; }
	.ypc-d { font: 700 var(--ypc-day, 12pt)/1.05 var(--sans); color: #000; margin: 0; }
	.ypc-l { display: block !important; font: 700 var(--ypc-lab, 8pt)/1.12 var(--sans); overflow-wrap: normal; word-break: normal; }
	.ypc-l .ypc-tag { display: inline; font: inherit; padding: 0; background: none; color: #000; white-space: normal; }
	.ypc-list { display: none !important; }
	.ypc-foot { flex: 0 0 auto; margin: 0.08in 0 0; font: 400 8pt/1.3 var(--sans); color: #000; }
}
