.form-group {
	margin-bottom: 1rem !important;
}

.form-group > label {
	font-weight: 500;
}

.form-group table.input-options td {
	display: block;
}

.form-group table.input-options td input {
	margin-right: 6px;
}

select.form-control[size="1"] {
	height: calc(1.5em + .75rem + 2px);
}

label {
	margin-bottom: 4px;
}

label.required:after {
	content: '*';
	padding-left: 3px;
	color: #692327;
}

.btn {
	padding: 4px 12px !important;
	transition: box-shadow 0.3s ease;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
}

.btn:active,
.btn:hover {
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.btn-label i {
	margin-right: 8px;
	font-size: 14px;
}

.btn-light, .btn-light:hover, .btn-light:active,
.btn-link, .btn-link:hover, .btn-link:active {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.table .btn-light {
	padding: 0 !important;
}

.btn-row {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.repeatable > a.btn {
	margin-top: -5px;
}

.repeatable h3 {
	margin: 1rem 0 1rem;
}

.select-filter-row .btn {
	margin: 0 !important;
	display: block;
}

#manage-members h3 {
	margin: 1rem 0 2rem;
}

.radio-item input {
	display: inline-block;
	margin-right: 5px;
}

@media (min-width: 768px) {

	.select-filter-row .form-group {
		padding-top: 2rem !important;
	}

	.select-filter-row .btn {
		margin: 2rem 0 0 !important;
	}
}

.ranking-calculator .player-select {
	flex: 1;
}

.ranking-calculator label {
	font-weight: 500;
}

.ranking-calculator .new-ranking {
	min-width: 70px;
}

.ranking-calculator .inputs {
	display: flex;
	gap: 24px;
	margin-top: 32px;
}

.ranking-calculator .score-table div.form-group {
	margin: 0;
}

.ranking-calculator .score-table {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
}

.ranking-calculator .score-table::after {
	content: "";
	flex: auto;
}

.ranking-calculator .score-table .form-group {
	max-width: 120px;
}

.ranking-calculator .score-table .input-group-text {
	width: 40px;
}

.ranking-calculator .score-record {
	display: flex;
	gap: 8px;
	align-items: center;
}

.ranking-calculator .score-record .badge {
	width: 60px;
}

.ranking-calculator .input-group {
	margin-bottom: 0 !important;
}

.ranking-calculator .btn {
	margin-top: -4px;
}

/* The PrimeFaces theme styles every bare input — `body input:not([role=combobox],[type=file],
   .ui-widget,.ui-inputfield)` — and its specificity beats Bootstrap's single-class
   .form-check-input. The `background` shorthand in there resets background-repeat to `repeat`
   and background-size to `auto`, so restore both: on a switch the knob is half the track's
   width and would otherwise tile twice across it. */
.form-check .form-check-input {
	padding: 0 !important;
	background-repeat: no-repeat !important;
	background-size: contain !important;
}

/* Same override kills the checked image on a plain checkbox (login "remember me") — restore
   Bootstrap's white check on blue. Switches are excluded: their image is the knob, set by the
   two-class .form-switch .form-check-input, which outranks the theme and needs no help. */
.form-check:not(.form-switch) .form-check-input:checked[type="checkbox"] {
	background-color: #0d6efd !important;
	border-color: #0d6efd !important;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
}



/* Selected dates of an activity, shown as pills under the inline date picker. The box
   mirrors the .ui-datepicker panel so the two read as one field, and turns into a dashed
   placeholder while nothing is selected. Clicking a pill removes that date. */
.date-pills {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin-top: 8px;
	min-height: 42px;
	padding: .5rem;
	border: 1px solid #ced4da;
	border-radius: 4px;
	background: #fff;
}

.date-pills.empty {
	border-style: dashed;
	background: transparent;
}

/* Not ".placeholder": Bootstrap owns that class as a skeleton-loader
   (background-color: currentcolor) and paints a grey block over the text. */
.date-pills-hint {
	color: #6c757d;
}

.date-pills .ui-chip.removable {
	cursor: pointer;
	transition: background-color .2s, color .2s;
}

.date-pills .ui-chip.removable:hover {
	background-color: #f8d7da;
	color: #842029;
	text-decoration: line-through;
}