/* Progress: kit, medical, bio, attendance. Light paper, navy, no volt. */
.vball-prog{
	--vball-navy:#0a1628;
	--vball-ink:#1d2327;
	--vball-muted:#646970;
	--vball-line:#dcdcde;
	--vball-paper:#fff;
	--vball-wash:#f6f7f7;
	--vball-ok:#0a7a32;
	--vball-ok-wash:#eef8f1;
	--vball-amber:#b45309;
	--vball-amber-wash:#fef6e7;
	--vball-danger:#c62828;
	--vball-danger-wash:#fde8e8;
	color:var(--vball-ink);
	max-width:78rem;
}
.vball-prog h1,.vball-prog h2,.vball-prog h3{color:var(--vball-navy);margin:.2rem 0 .5rem}
.vball-prog__eyebrow{
	margin:0 0 .25rem;
	color:var(--vball-muted);
	font-size:11px;
	font-weight:800;
	letter-spacing:.12em;
	text-transform:uppercase;
}
.vball-prog__meta{margin:0 0 1rem;color:var(--vball-muted)}
.vball-prog-kpis{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
	gap:12px;
	margin:0 0 1.25rem;
}
.vball-prog-kpi{
	background:var(--vball-paper);
	border:1px solid var(--vball-line);
	border-radius:12px;
	padding:.85rem 1rem;
}
.vball-prog-kpi__lab{display:block;color:var(--vball-muted);font-size:.8rem}
.vball-prog-kpi__n{display:block;font-size:1.6rem;font-weight:700;color:var(--vball-navy);line-height:1.2}
.vball-prog-kpi.is-warn{border-color:#e8c48a;background:var(--vball-amber-wash)}
.vball-prog-kpi.is-bad{border-color:#f0b4b4;background:var(--vball-danger-wash)}
.vball-prog-kpi.is-ok{border-color:#b7dcc3;background:var(--vball-ok-wash)}

.vball-prog-bar{
	display:block;
	height:10px;
	background:var(--vball-wash);
	border:1px solid var(--vball-line);
	border-radius:10px;
	overflow:hidden;
	margin:.4rem 0 .15rem;
}
.vball-prog-bar__fill{
	display:block;
	height:100%;
	background:var(--vball-navy);
	border-radius:10px;
	min-width:0;
}
.vball-prog-bar__fill.is-ok{background:var(--vball-ok)}
.vball-prog-bar__fill.is-amber{background:var(--vball-amber)}
.vball-prog-bar__fill.is-bad{background:var(--vball-danger)}
.vball-prog-bar.is-lg{height:14px}

.vball-prog-stack{
	display:flex;
	height:14px;
	border:1px solid var(--vball-line);
	border-radius:10px;
	overflow:hidden;
	background:var(--vball-wash);
}
.vball-prog-stack > span{display:block;height:100%;min-width:0}
.vball-prog-stack .is-present,
.vball-prog-stack .is-ok{background:var(--vball-ok)}
.vball-prog-stack .is-late,
.vball-prog-stack .is-warn,
.vball-prog-stack .is-amber{background:var(--vball-amber)}
.vball-prog-stack .is-absent,
.vball-prog-stack .is-bad,
.vball-prog-stack .is-danger{background:var(--vball-danger)}
.vball-prog-stack .is-open{background:#dcdcde}

.vball-prog-legend{
	display:flex;
	flex-wrap:wrap;
	gap:.75rem 1.1rem;
	margin:.5rem 0 1rem;
	color:var(--vball-muted);
	font-size:.85rem;
}
.vball-prog-legend i{
	display:inline-block;
	width:10px;height:10px;
	border-radius:3px;
	margin-right:.35rem;
	vertical-align:middle;
}
.vball-prog-legend .is-present,
.vball-prog-legend .is-ok{background:var(--vball-ok)}
.vball-prog-legend .is-late,
.vball-prog-legend .is-warn,
.vball-prog-legend .is-amber{background:var(--vball-amber)}
.vball-prog-legend .is-absent,
.vball-prog-legend .is-bad,
.vball-prog-legend .is-danger{background:var(--vball-danger)}
.vball-prog-legend .is-open{background:#dcdcde}

.vball-prog-switch{
	display:flex;
	flex-wrap:wrap;
	gap:.5rem;
	align-items:center;
	margin:0 0 1rem;
}
.vball-prog-switch label{margin:0;color:var(--vball-muted);font-size:.85rem}
.vball-prog-switch select,
.vball-prog-switch button,
.vball-prog-switch .button{
	min-height:44px;
	border-radius:10px;
	border:1px solid var(--vball-line);
	padding:0 .85rem;
	background:var(--vball-paper);
	color:var(--vball-navy);
}
.vball-prog-switch .button-primary,
.vball-prog a.button-primary{
	background:var(--vball-navy);
	border-color:var(--vball-navy);
	color:#fff;
	min-height:44px;
	border-radius:10px;
}
.vball-prog-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem}
.vball-prog-chips a{
	display:inline-flex;
	align-items:center;
	min-height:44px;
	padding:0 .9rem;
	border:1px solid var(--vball-line);
	border-radius:10px;
	background:var(--vball-paper);
	color:var(--vball-navy);
	text-decoration:none;
	font-size:.9rem;
}
.vball-prog-chips a.is-on{
	background:var(--vball-navy);
	border-color:var(--vball-navy);
	color:#fff;
}

.vball-prog-card{
	background:var(--vball-paper);
	border:1px solid var(--vball-line);
	border-radius:12px;
	padding:1rem 1.1rem;
	margin:0 0 1rem;
}
.vball-prog-hub{
	background:transparent;
	border:0;
	border-radius:0;
	padding:.35rem 0 1rem;
	margin:0 0 1rem;
}
.vball-prog-hub{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:space-between;
	gap:.75rem 1.25rem;
}
.vball-prog-hub__stats{flex:1 1 16rem;min-width:12rem}
.vball-prog-hub__actions{display:flex;flex-wrap:wrap;gap:.5rem}
.vball-prog-hub__actions a,
.vball-prog-hub__actions button{
	min-height:44px;
	border-radius:10px;
}

.vball-prog-teams{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
	gap:12px;
	margin:0 0 1.25rem;
}
.vball-prog-team{
	display:block;
	background:var(--vball-paper);
	border:1px solid var(--vball-line);
	border-radius:12px;
	padding:.9rem 1rem;
	color:inherit;
	text-decoration:none;
}
.vball-prog-team:hover{border-color:var(--vball-navy)}
.vball-prog-team strong{display:block;color:var(--vball-navy)}
.vball-prog-team .vball-prog-meta{color:var(--vball-muted);font-size:.85rem}
.vball-prog-team.is-amber{border-color:#e8c48a;background:var(--vball-amber-wash)}
.vball-prog-team.is-bad{border-color:#f0b4b4;background:var(--vball-danger-wash)}
.vball-prog-team.is-ok{border-color:#b7dcc3}

.vball-prog-table{width:100%;border-collapse:collapse;background:var(--vball-paper);border:1px solid var(--vball-line);border-radius:12px;overflow:hidden}
.vball-prog-table th,
.vball-prog-table td{
	border-bottom:1px solid var(--vball-line);
	padding:.55rem .7rem;
	text-align:left;
	vertical-align:top;
	font-size:.92rem;
}
.vball-prog-table th{background:var(--vball-wash);color:var(--vball-navy);font-weight:650}
.vball-prog-table tr.is-missing,
.vball-prog-table tr.is-warn{background:var(--vball-amber-wash)}
.vball-prog-table tr.is-bad{background:var(--vball-danger-wash)}
.vball-prog-table tr.is-ok{background:var(--vball-ok-wash)}
.vball-prog-table tr.is-open{background:var(--vball-wash)}
.vball-prog-chip{
	display:inline-block;
	margin:.1rem .2rem .1rem 0;
	padding:.15rem .45rem;
	border-radius:8px;
	border:1px solid var(--vball-line);
	font-size:.78rem;
	color:var(--vball-muted);
	background:var(--vball-wash);
}
.vball-prog-chip.is-have{color:var(--vball-ok);border-color:#b7dcc3;background:var(--vball-ok-wash)}
.vball-prog-chip.is-ordered{color:var(--vball-navy);border-color:#c5cdd6}
.vball-prog-chip.is-missing{color:var(--vball-amber);border-color:#e8c48a;background:var(--vball-amber-wash)}
.vball-prog-chip.is-bad{color:var(--vball-danger);border-color:#f0b4b4;background:var(--vball-danger-wash)}

.vball-prog-att-row{margin:0 0 .85rem}
.vball-prog-att-row__head{
	display:flex;
	justify-content:space-between;
	gap:.5rem;
	font-size:.9rem;
	margin:0 0 .25rem;
}
.vball-prog-att-row__head a{color:var(--vball-navy)}
.vball-prog-live{
	display:inline-block;
	margin-left:.4rem;
	color:var(--vball-ok);
	font-weight:700;
	font-size:.8rem;
}

/* Family strip */
.vball-family-progress{
	margin:.75rem 0 1rem;
	padding:.85rem 1rem;
	background:#fff;
	border:1px solid #dcdcde;
	border-radius:12px;
}
.vball-family-progress.is-done{
	border-color:#b7dcc3;
	background:#eef8f1;
}
.vball-family-progress__title{
	margin:0 0 .45rem;
	color:#0a1628;
	font-size:1rem;
	font-weight:700;
}
.vball-family-progress__done{
	margin:0;
	color:#0a7a32;
	font-weight:650;
}
.vball-family-progress__pills{
	display:flex;
	flex-wrap:wrap;
	gap:.45rem;
	margin:0 0 .5rem;
}
.vball-family-progress__pill{
	display:inline-flex;
	align-items:center;
	min-height:36px;
	padding:0 .7rem;
	border-radius:10px;
	border:1px solid #dcdcde;
	font-size:.85rem;
	color:#646970;
	background:#f6f7f7;
}
.vball-family-progress__pill.is-ok{color:#0a7a32;border-color:#b7dcc3;background:#eef8f1}
.vball-family-progress__pill.is-miss{color:#b45309;border-color:#e8c48a;background:#fef6e7}
.vball-family-progress__pill.is-skip{color:#646970}
.vball-family-progress ul{
	margin:.25rem 0 0;
	padding:0 0 0 1.1rem;
	color:#646970;
	font-size:.9rem;
}
.vball-family-progress li{margin:.15rem 0}

.vball-prog-kiosk .vball-kiosk{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
	gap:.5rem;
	margin:1rem 0;
}
.vball-prog-kiosk .vball-kiosk-btn{
	min-height:64px;
	border-radius:12px;
	border:1px solid #dcdcde;
	background:#fff;
	color:#0a1628;
	padding:.5rem;
}
.vball-prog-kiosk .vball-kiosk-btn.is-in{background:#eef8f1;border-color:#b7dcc3}
.vball-prog-kiosk .vball-kiosk-btn.is-red{background:#fde8e8;border-color:#f0b4b4}

@media (max-width:640px){
	.vball-prog-table{display:block;overflow-x:auto}
	.vball-prog-hub{display:block}
	.vball-prog-hub__actions{margin-top:.6rem}
}