/* SnapHub borderless checkbox / radio component. */
.fig-choice-control {
	--fig-choice-border: #bfc2c7;
	--fig-choice-text: #34383d;
	--fig-choice-accent: var(--primary, #ff5555);
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr) auto;
	align-items: center;
	min-width: 0;
	min-height: 28px;
	gap: 9px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	cursor: pointer;
}

.fig-choice-control__input {
	appearance: none;
	-webkit-appearance: none;
	box-sizing: border-box;
	width: 20px;
	height: 20px;
	margin: 0;
	border: 1px solid var(--fig-choice-border);
	background: #fff;
	outline: 0;
	box-shadow: none;
	cursor: inherit;
	transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.fig-choice-control--checkbox .fig-choice-control__input {
	border-radius: 5px;
}

.fig-choice-control--radio .fig-choice-control__input {
	border-radius: 50%;
}

.fig-choice-control__text {
	min-width: 0;
	color: var(--fig-choice-text);
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	word-break: keep-all;
	transition: color .16s ease;
}

.fig-choice-control:hover .fig-choice-control__input:not(:disabled) {
	border-color: #ff9ba1;
}

.fig-choice-control__input:focus-visible:not(:disabled) {
	border-width: 2px;
	border-color: var(--fig-choice-accent);
	outline: 0;
	box-shadow: none;
}

.fig-choice-control--checkbox .fig-choice-control__input:checked:not(:disabled) {
	border-width: 2px;
	border-color: var(--fig-choice-accent);
	background-color: var(--fig-choice-accent);
	background-image: url("../svg/common/icon-choice-check.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 20px 20px;
}

.fig-choice-control--radio .fig-choice-control__input:checked:not(:disabled) {
	border-width: 2px;
	border-color: var(--fig-choice-accent);
	background: radial-gradient(circle at center, #fff 0 4px, var(--fig-choice-accent) 4.5px 100%);
}

.fig-choice-control:has(.fig-choice-control__input:checked:not(:disabled)) .fig-choice-control__text {
	color: #ef4f58;
	font-weight: 600;
}

.fig-choice-control:has(.fig-choice-control__input:disabled) {
	cursor: not-allowed;
}

.fig-choice-control .fig-choice-control__input:disabled,
.fig-choice-control:hover .fig-choice-control__input:disabled,
.fig-choice-control .fig-choice-control__input:disabled:focus,
.fig-choice-control .fig-choice-control__input:disabled:focus-visible,
.fig-choice-control .fig-choice-control__input:disabled:active {
	border-width: 1px;
	border-color: #d9dce0;
	background-color: #f2f3f4;
	outline: 0;
	box-shadow: none;
	cursor: not-allowed;
}

.fig-choice-control--checkbox .fig-choice-control__input:disabled:checked {
	border-width: 1px;
	border-color: #c8cbd0;
	background-color: #c8cbd0;
	background-image: url("../svg/common/icon-choice-check.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 20px 20px;
}

.fig-choice-control--radio .fig-choice-control__input:disabled:checked {
	border-width: 1px;
	border-color: #c8cbd0;
	background: radial-gradient(circle at center, #fff 0 4px, #c8cbd0 4.5px 100%);
}

.fig-choice-control:has(.fig-choice-control__input:disabled) .fig-choice-control__text {
	color: #a2a5a9;
	font-weight: 500;
}

.fig-choice-control--compact {
	grid-template-columns: 20px auto;
	min-height: 32px;
}

.shooting-detail-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 24px;
	row-gap: 12px;
}

.shooting-detail-grid .fig-choice-control {
	flex: 0 0 auto;
	width: auto;
	min-width: max-content;
}

@media (max-width: 600px) {
	.shooting-detail-grid {
		column-gap: 18px;
		row-gap: 10px;
	}
}
