/**
 * The insurance checklist (docs/13-TOOLS.md §4.8): its rows, tabs, count and tools, on top of calc.css's card and
 * plate. Render-blocking on the checklist's page only (inc/calc.php).
 */

.mn-check__asof { color: var(--mn-text-muted); font-size: var(--wp--custom--font-size--meta); font-weight: 600; }
.mn-check__tabs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2px; padding: 3px; border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius--md); background: var(--wp--preset--color--paper); }
.mn-check__tabs [role="tab"] {
	min-block-size: var(--wp--custom--target--min);
	padding: 6px 12px;
	border: 0;
	border-radius: var(--wp--custom--radius--sm);
	background: none;
	color: var(--mn-text);
	font: 600 var(--wp--custom--font-size--ui) / 1.2 var(--wp--preset--font-family--body);
	cursor: pointer;
}
.mn-check__tabs [role="tab"]:hover { background: var(--wp--preset--color--white); color: var(--mn-text-strong); }
.mn-check__tabs [aria-selected="true"] { background: var(--wp--preset--color--ink-1); box-shadow: inset 0 -3px 0 var(--wp--preset--color--cyan), var(--wp--preset--shadow--ink); color: var(--wp--preset--color--white); }
.mn-check__panel { display: grid; gap: 14px; }
.mn-check__panel + .mn-check__panel { padding-block-start: 22px; border-block-start: 1px solid var(--wp--preset--color--line); }
.mn-check.has-tabs .mn-check__panel + .mn-check__panel { padding-block-start: 0; border-block-start: 0; }
.mn-check.has-tabs .mn-check__heading { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.mn-check__heading { margin: 0; font-size: var(--wp--preset--font-size--large); }
.mn-check__lede { color: var(--mn-text); line-height: 1.5; }
.mn-check__list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-block-start: 1px solid var(--wp--preset--color--line); }
.mn-check__row { position: relative; border-block-end: 1px solid var(--wp--preset--color--line); }
.mn-check__input { position: absolute; inset-block-start: 14px; inset-inline-start: 0; inline-size: 44px; block-size: 44px; margin: 0; opacity: 0; cursor: pointer; }
.mn-check__label { display: flex; align-items: flex-start; gap: 14px; min-block-size: 64px; padding: 14px 4px 14px 0; cursor: pointer; }
.mn-check__box {
	box-sizing: border-box;
	flex: none;
	display: grid;
	place-items: center;
	inline-size: 28px;
	block-size: 28px;
	margin: 8px;
	border: 1.5px solid var(--wp--preset--color--field);
	border-radius: var(--wp--custom--radius--xs);
	background: var(--wp--preset--color--white);
	transition: background-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease), border-color var(--wp--custom--motion--micro) var(--wp--custom--motion--ease);
}
.mn-check__input:checked + .mn-check__label .mn-check__box { border-color: var(--wp--preset--color--ink-1); background: var(--wp--preset--color--ink-1); }
.mn-check__input:checked + .mn-check__label .mn-check__box::after {
	content: "";
	inline-size: 15px;
	block-size: 15px;
	background: var(--wp--preset--color--cyan);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.mn-check__input:focus-visible + .mn-check__label .mn-check__box { outline: var(--wp--custom--focus--width) solid var(--mn-focus); outline-offset: 3px; }
.mn-check__text { display: grid; gap: 3px; padding-block-start: 9px; }
.mn-check__name { color: var(--mn-text-strong); font-weight: 600; line-height: 1.4; }
.mn-check__min { color: var(--wp--preset--color--cyan-700); font-size: var(--wp--custom--font-size--ui); font-weight: 700; }
.mn-check__note { color: var(--mn-text-muted); font-size: var(--wp--custom--font-size--meta); line-height: 1.45; }
.mn-check__waiver { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: var(--wp--custom--radius--md); background: var(--wp--preset--color--paper); color: var(--mn-text-strong); font-size: var(--wp--preset--font-size--small); line-height: 1.5; }
.mn-check__waiver .mn-icon { flex: none; inline-size: 1.125rem; block-size: 1.125rem; margin-block-start: 1px; color: var(--wp--preset--color--cyan-700); }
.mn-check__count { color: var(--wp--preset--color--white); font-family: var(--wp--preset--font-family--display); font-size: clamp(2rem, 1.6rem + 1.4vw, 2.75rem); font-weight: 800; letter-spacing: var(--wp--custom--tracking--heading); line-height: 1; }
.mn-check:not(.is-live) .mn-check__count,
.mn-check:not(.is-live) .mn-check__meter { display: none; }
.mn-check__meter { display: block; block-size: 10px; border-radius: var(--wp--custom--radius--pill); background: var(--mn-calc-track); overflow: hidden; }
.mn-check__meter > span { display: block; block-size: 100%; inline-size: var(--w, 0%); border-radius: inherit; background: linear-gradient(90deg, var(--wp--preset--color--cyan-700), var(--wp--preset--color--cyan)); transition: inline-size var(--wp--custom--motion--ui) var(--wp--custom--motion--ease-out); }
.mn-check[data-done="all"] .mn-check__meter > span { background: var(--wp--preset--color--led); }
.mn-check__tools { display: grid; gap: 8px; }
.mn-check__tools .mn-btn { justify-content: flex-start; }
.mn-check__copied { color: var(--wp--preset--color--on-dark); font-size: var(--wp--preset--font-size--small); }
/* With scripting on, the page is laid out as the script will leave it (tabs, the first list, the count), so nothing
   moves when it runs; without it, both lists print one after the other. */
@media (scripting: enabled) {
	.mn-calc .mn-check__tabs[hidden] { display: grid !important; }
	.mn-calc .mn-check__tools[hidden] { display: grid !important; }
	.mn-check:not(.is-live) [data-mn-check-panel="buy"] { display: none; }
	.mn-check:not(.is-live) :is(.mn-check__count, .mn-check__meter) { display: block; }
	.mn-check:not(.is-live) .mn-check__heading { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
.mn-check__copied:empty { display: none; }