.p-timeline { padding-block: 0 40px; }
.p-timeline__header { display: grid; grid-template-columns: 1fr; row-gap: 30px; background: #fff; }
.p-timeline__heading { grid-area: 2; font-size: 32px; font-weight: var(--font-weight-medium); text-align: center; }
.p-timeline__back { display: grid; grid-template-columns: 1fr auto 1fr; grid-area: 1 / 1; padding-block: 20px; border-block: 1px solid #d3d3d3; font-size: 16px; font-weight: var(--font-weight-medium); }
.p-timeline__back::before { width: 12px; height: 28px; background: #878787; clip-path: polygon(0 0, 3px 0, 100% 50%, 3px 100%, 0 100%, 9px 50%); content: ''; transform: rotate(180deg); }
.p-timeline-filter { margin-top: 40px; }
.p-timeline-filter__list, .p-timeline-filter__item { display: grid; row-gap: 20px; }
.p-timeline-filter__list { row-gap: 30px; }
.p-timeline-filter__selects { display: grid; grid-template-columns: 1fr auto 1fr; gap: 15px; align-items: center; }
.p-timeline-filter__separator { font-weight: var(--font-weight-bold); }
.p-timeline-filter__tags { display: flex; flex-wrap: wrap; gap: 10px 5px; }
.p-timeline-filter__tag { cursor: pointer; }
.p-timeline-filter__tag:has(input:checked) { --timeline-tag-bg: #ffdda0; --timeline-tag-border-color: #ff9f55; }
.p-timeline-filter__search { display: grid; grid-template-columns: 1fr 72px; overflow: hidden; border: 1px solid #d5d5d5; border-radius: var(--rounded-sm); font-size: 16px; }
.p-timeline-filter__input { padding: 5px 15px; }
.p-timeline-filter__input::placeholder { color: #999; }
.p-timeline-filter__button { display: grid; place-items: center; border-radius: calc(var(--rounded-sm) - 1px); background: #ffd735; font-weight: var(--font-weight-medium); }
.p-timeline__items { display: grid; position: relative; margin-top: 35px; border-top: 1px solid #d3d3d3; }
.p-timeline__items > * { border-bottom: 1px solid #d3d3d3; }
.p-timeline__items > [hidden] { display: none; }
.p-timeline__banner { padding: 20px 24px; }
.p-timeline__empty { padding-block: 30px; text-align: center; }
.p-timeline__more { margin-top: 20px; }
.p-timeline .c-timeline-card__header { transition: background-color var(--duration) var(--easing-primary); }
.p-timeline .c-timeline-card__header:hover { background-color: #fff9e8; }
