#ticket_tree_outer {
	margin: 16px 0 24px 0;
	border: 1px solid var(--bs-border-color);
	padding: 8px;
}

#ticket_tree_outer h3 {
	margin: 16px 0 0 0;
}

#ticket_tree_outer > h3:first-child {
	margin-top: 0;
}

.ticket_tree_radios {
	display: flex;
	flex-wrap: nowrap;
}

.ticket_tree_radios input {
	position: absolute;
	left: -10000px;
}

.ticket_tree_radios input + label {
	flex-grow: 1;
	position: relative;
	display: block;
	margin: 5px;
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  background: var(--bs-light);
	padding: 10px 16px;
	font-weight: 600;
	text-align: center;
	transition: all .3s;
}

.ticket_tree_radios input:checked + label {
	color: white;
	background: var(--bs-primary);
	border-color: var(--bs-primary);
}

@media only screen and (max-width: 768px) {
	div#ticket_tree_outer h3 {
		margin-bottom: 5px;
	}

	#ticket_tree_trips,
	#ticket_tree_days {
		display: block;
		width: 100%;
		text-align: center;
	}

	#ticket_tree_trips label,
	#ticket_tree_days label {
		width: calc((100% / 3) - 3px);
		float: left;
		padding-left: 0;
		padding-right: 0;
		margin: 0 4px 4px 0;
		display: block;
		flex: none;
	}

	#ticket_tree_trips label:nth-child(3n),
	#ticket_tree_days label:nth-child(3n) {
		margin-right: 0;
	}
}

/**
 * Tickets
 */
.ticket_tree_table {
	position: relative;
}

.ticket_tree_table .user {
	font-size: 18px;
	font-weight: 600;
	color: var(--bs-secondary);
	padding: 15px 0 5px 0;
	border-bottom: 1px solid #aaa;
}

/**
 * Desktop tickets
 */
@media only screen and (min-width: 769px) {
	.ticket_tree_table .product {
		display: flex;
		flex-direction: row;
		flex-grow: 1;
		border-left: 1px solid #aaa;
		border-right: 1px solid #aaa;
		border-bottom: 1px solid #aaa;
	}

	.ticket_tree_table .product:nth-child(odd) {
		background: #f5f5f5;
	}

	.ticket_tree_table .product > div {
		flex: 1;
	}

	.ticket_tree_table .product > div.name,
	.ticket_tree_table .product > div.price {
		display: flex;
		flex-direction: column;
		justify-content: center;
		border-right: 1px solid #aaa;
		font-weight: 600;
	}

	.ticket_tree_table .product > div.name {
		padding: 6px 10px;
	}

	.ticket_tree_table .product > div.price {
		padding: 6px 10px;
	}

	.ticket_tree_table .product > div.variants {
		flex: 4;
	}

	.ticket_tree_table .product .variant {
		display: flex;
		flex-direction: row;
		border-bottom: 1px solid #aaa;
	}

	.ticket_tree_table .product .variant:last-child {
		border-bottom: 0;
	}

	.ticket_tree_table .product .variant > div {
		padding: 6px 10px;
	}

	.ticket_tree_table .product .variant > .channel {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		border-right: 1px solid #aaa;
		font-weight: 600;
	}

	.ticket_tree_table .product .variant > .info {
		flex: 3;
	}
}

/**
 * Reset etickets .info styles
 */
.ticket_tree_table .product .variant > .info {
	margin: 0;
	border: 0;
	font-size: inherit;
}

/**
 * Mobile tickets
 */
@media only screen and (max-width: 768px) {
	.ticket_tree_table .product {
		border-left: 1px solid #aaa;
		border-right: 1px solid #aaa;
	}

	.ticket_tree_table .product > div.name,
	.ticket_tree_table .product > div.price {
		width: 50%;
		padding: 6px 10px;
		font-weight: 600;
    background: var(--bs-dark);
    color: white;
	}

	.ticket_tree_table .product > div.name {
		float: left;
	}

	.ticket_tree_table .product > div.price {
		float: right;
		text-align: right;
	}

	.ticket_tree_table .product > .variants {
		background: #f5f5f5;
		border-top: 1px solid #aaa;
		overflow: hidden;
		width: 100%;
		padding-left: 0;
	}

	.ticket_tree_table .product > .variants .channel {
		font-weight: 600;
		padding: 6px 10px;
		border-bottom: 1px solid #aaa;
		border-left: 1px solid #aaa;
		background: white;
	}

	.ticket_tree_table .product > .variants .info {
		padding: 6px 10px;
		border-bottom: 1px solid #aaa;
		border-left: 1px solid #aaa;
		background: #fafafa;
	}
}

/*.ticket_tree_table .product .variant > .info .link {*/
/*	font-weight: 700;*/
/*	max-width: 120px;*/
/*	display: block;*/
/*	font-size: 10px;*/
/*	background: #0b386e;*/
/*	color: #fff;*/
/*	padding: 8px 12px;*/
/*	border-radius: 2px;*/
/*	text-transform: uppercase;*/
/*	white-space: nowrap;*/
/*	margin-top: 8px;*/
/*}*/