.custom-history {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 48px 16px;
	background: #FAFAFB;
}

.custom-history__periods { border-top: 1px solid #D9DBDD; }

.custom-history__period-wrap { border-bottom: 1px solid #D9DBDD; }

.custom-history__period-title { margin: 0; }

.custom-history__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	padding: 24px 0;
	color: #58595B;
	background: transparent;
	border: 0;
	font: inherit;
	font-weight: 700;
	text-align: left;
	cursor: pointer;
}

.custom-history__toggle:hover,
.custom-history__toggle:focus,
.custom-history__toggle:focus-visible,
.custom-history__toggle:active {
	color: #000000;
	background: transparent;
	border-color: transparent;
	box-shadow: none;
	outline-color: #E60012;
}

.custom-history__period { font-size: 18px; }

.custom-history__chevron {
	width: 12px;
	height: 12px;
	flex: none;
	color: #E60012;
	transition: transform 200ms cubic-bezier(0.2, 0, 0, 1);
}

.custom-history__toggle[aria-expanded='true'] .custom-history__chevron { transform: rotate(180deg); }

.custom-history__panel { padding-bottom: 32px; }

.custom-history__panel[hidden] { display: none; }

.custom-history__items {
	position: relative;
	display: grid;
	gap: 24px;
	padding-left: 24px;
}

.custom-history__items::before {
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 3px;
	width: 1px;
	background: #D9DBDD;
	content: '';
}

@media (min-width: 768px) {
	.custom-history { padding: 64px 24px; }
}

@media (min-width: 1025px) {
	.custom-history { padding-right: 32px; padding-left: 32px; }
	.custom-history__period { font-size: 20px; }
}