/* WORKDAY */

.WORKDAY {
	display: flex;
	justify-content: space-between;
}

.WORKDAY #workday-filter {
	width: var(--col-3);
	flex: 0 0 auto;
}

.WORKDAY .filter {
	float: none;
	margin: 0;
}

.WORKDAY .filter input[type="text"],
.WORKDAY .filter select {
	appearance: none;
	font-family: inherit;
	font-size: 16rem;
	color: var(--black);
	display: block;
	background: var(--white);
	width: 100%;
	padding: 0 var(--s3);
	margin: 0;
	border-radius: 9999rem;
	border: 1px solid var(--grey-300);
	box-sizing: border-box;
	height: var(--s6);
	line-height: var(--s6);
	margin-bottom: var(--s1);
}

.WORKDAY .filter input[type="text"]:focus,
.WORKDAY .filter select:focus {
	outline: none;
	border-color: var(--blue-500);
}

.WORKDAY .filter input[type="text"]::placeholder,
.WORKDAY .filter select::placeholder {
	color: var(--black);
}

.WORKDAY .filter input[type="text"] {
	padding-right: var(--s6);
	background: url('../../assets/images/ui-search.svg') no-repeat right 16rem top 15rem / 16rem 16rem;
}

.WORKDAY .filter select {
	padding-right: var(--s6);
	background: url('../../assets/images/ui-expand.svg') no-repeat right 20rem top 21rem / 10rem 7rem;
}

.WORKDAY .filter select.b-disabled {
	display: none;
}

.WORKDAY .filter .search {
	position: relative;
}

.WORKDAY .filter button {
	position: absolute;
	top: 0;
	right: 0;
	width: var(--s6);
	height: var(--s6);
	cursor: pointer;
	opacity: 0;
	text-indent: -9999rem;
}

.WORKDAY #workday-feed {
	width: var(--col-9);
	flex: 0 0 auto;
}


.WORKDAY #workday-feed .loading {
	height: 314rem;
	border: 1px solid var(--blue-500);
	border-width: 1px 0;
	position: relative;
}

.WORKDAY #workday-feed .loading::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: var(--s5);
	height: var(--s5);
	border-radius: 999rem;
	background: var(--grey-100) url('../../assets/images/ui-loading.svg') no-repeat center / 24rem 24rem;
	transform: translate(-50%, -50%);
}

.WORKDAY .group {
	overflow: hidden;
	position: relative;
	border-top: 1px solid var(--grey-200);
	padding: var(--s5) 0;
}

.WORKDAY .group:last-child {
	border-bottom: 1px solid var(--grey-200);
}

.WORKDAY h4 {
	padding-right: var(--s12);
}

.WORKDAY .count {
	position: absolute;
	top: var(--s5);
	right: var(--s6);
	color: var(--blue-500);
	margin: 6rem 0 0;
	font-weight: 500;
}

.WORKDAY .toggle {
	display: block;
	position: absolute;
	top: var(--s5);
	right: 0;
	width: var(--s5);
	height: var(--s5);
	text-indent: -9999rem;
	border: none;
	padding: 0;
	margin: 1rem 0 0;
	cursor: pointer;
	background: none;
	box-shadow: inset 0 0 0 1px var(--blue-500);
	color: var(--blue-700);
	border-radius: 9999rem;
	transition: background-color 0.25s, color 0.25s;
}

.WORKDAY .toggle svg {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: var(--s5);
	height: var(--s5);
	fill: currentColor;
}

.WORKDAY .toggle svg:nth-child(1) {
	display: block;
}

.WORKDAY .toggle::after {
	content: '';
	position: absolute;
	top: var(--ns3);
	right: 0;
	bottom: var(--ns3);
	left: -9999rem;
}

.WORKDAY .toggle:hover {
	background: var(--blue-500);
	color: var(--white);
}

.WORKDAY ul {
	margin: 0;
	padding: 0;
	list-style: none;
	max-height: var(--height);
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.25s;
}

.WORKDAY li {
	padding: 4rem 0;
}

.WORKDAY li:first-child {padding-top: var(--s3);}
.WORKDAY li:last-child {padding-bottom: 0;}

.WORKDAY a {
	color: var(--black);
	text-decoration: none;
	display: flex;
	align-items: baseline;
}

.WORKDAY a .title {
	transition: color 0.25s;
}

.WORKDAY a .location {
	font-size: 16rem;
	margin: 0 var(--s3);
	opacity: 0.8;
}

.WORKDAY a .label {
	flex-grow: 1;
	text-align: right;
}

.WORKDAY a:hover .b-button {
	color: var(--black);
}

.WORKDAY a:hover .title {
	color: var(--blue-500);
}



.WORKDAY[data-active="1"] .group:nth-child(1) ul,
.WORKDAY[data-active="2"] .group:nth-child(2) ul,
.WORKDAY[data-active="3"] .group:nth-child(3) ul,
.WORKDAY[data-active="4"] .group:nth-child(4) ul,
.WORKDAY[data-active="5"] .group:nth-child(5) ul,
.WORKDAY[data-active="6"] .group:nth-child(6) ul,
.WORKDAY[data-active="7"] .group:nth-child(7) ul,
.WORKDAY[data-active="8"] .group:nth-child(8) ul,
.WORKDAY[data-active="9"] .group:nth-child(9) ul,
.WORKDAY[data-active="10"] .group:nth-child(10) ul,
.WORKDAY[data-active="11"] .group:nth-child(11) ul,
.WORKDAY[data-active="12"] .group:nth-child(12) ul,
.WORKDAY[data-active="13"] .group:nth-child(13) ul,
.WORKDAY[data-active="14"] .group:nth-child(14) ul,
.WORKDAY[data-active="15"] .group:nth-child(15) ul,
.WORKDAY[data-active="16"] .group:nth-child(16) ul,
.WORKDAY[data-active="17"] .group:nth-child(17) ul,
.WORKDAY[data-active="18"] .group:nth-child(18) ul,
.WORKDAY[data-active="19"] .group:nth-child(19) ul,
.WORKDAY[data-active="20"] .group:nth-child(20) ul {max-height: var(--height);}

.WORKDAY[data-active="1"] .group:nth-child(1) .toggle svg:nth-child(1),
.WORKDAY[data-active="2"] .group:nth-child(2) .toggle svg:nth-child(1),
.WORKDAY[data-active="3"] .group:nth-child(3) .toggle svg:nth-child(1),
.WORKDAY[data-active="4"] .group:nth-child(4) .toggle svg:nth-child(1),
.WORKDAY[data-active="5"] .group:nth-child(5) .toggle svg:nth-child(1),
.WORKDAY[data-active="6"] .group:nth-child(6) .toggle svg:nth-child(1),
.WORKDAY[data-active="7"] .group:nth-child(7) .toggle svg:nth-child(1),
.WORKDAY[data-active="8"] .group:nth-child(8) .toggle svg:nth-child(1),
.WORKDAY[data-active="9"] .group:nth-child(9) .toggle svg:nth-child(1),
.WORKDAY[data-active="10"] .group:nth-child(10) .toggle svg:nth-child(1),
.WORKDAY[data-active="11"] .group:nth-child(11) .toggle svg:nth-child(1),
.WORKDAY[data-active="12"] .group:nth-child(12) .toggle svg:nth-child(1),
.WORKDAY[data-active="13"] .group:nth-child(13) .toggle svg:nth-child(1),
.WORKDAY[data-active="14"] .group:nth-child(14) .toggle svg:nth-child(1),
.WORKDAY[data-active="15"] .group:nth-child(15) .toggle svg:nth-child(1),
.WORKDAY[data-active="16"] .group:nth-child(16) .toggle svg:nth-child(1),
.WORKDAY[data-active="17"] .group:nth-child(17) .toggle svg:nth-child(1),
.WORKDAY[data-active="18"] .group:nth-child(18) .toggle svg:nth-child(1),
.WORKDAY[data-active="19"] .group:nth-child(19) .toggle svg:nth-child(1),
.WORKDAY[data-active="20"] .group:nth-child(20) .toggle svg:nth-child(1) {display: none;}

.WORKDAY[data-active="1"] .group:nth-child(1) .toggle svg:nth-child(2),
.WORKDAY[data-active="2"] .group:nth-child(2) .toggle svg:nth-child(2),
.WORKDAY[data-active="3"] .group:nth-child(3) .toggle svg:nth-child(2),
.WORKDAY[data-active="4"] .group:nth-child(4) .toggle svg:nth-child(2),
.WORKDAY[data-active="5"] .group:nth-child(5) .toggle svg:nth-child(2),
.WORKDAY[data-active="6"] .group:nth-child(6) .toggle svg:nth-child(2),
.WORKDAY[data-active="7"] .group:nth-child(7) .toggle svg:nth-child(2),
.WORKDAY[data-active="8"] .group:nth-child(8) .toggle svg:nth-child(2),
.WORKDAY[data-active="9"] .group:nth-child(9) .toggle svg:nth-child(2),
.WORKDAY[data-active="10"] .group:nth-child(10) .toggle svg:nth-child(2),
.WORKDAY[data-active="11"] .group:nth-child(11) .toggle svg:nth-child(2),
.WORKDAY[data-active="12"] .group:nth-child(12) .toggle svg:nth-child(2),
.WORKDAY[data-active="13"] .group:nth-child(13) .toggle svg:nth-child(2),
.WORKDAY[data-active="14"] .group:nth-child(14) .toggle svg:nth-child(2),
.WORKDAY[data-active="15"] .group:nth-child(15) .toggle svg:nth-child(2),
.WORKDAY[data-active="16"] .group:nth-child(16) .toggle svg:nth-child(2),
.WORKDAY[data-active="17"] .group:nth-child(17) .toggle svg:nth-child(2),
.WORKDAY[data-active="18"] .group:nth-child(18) .toggle svg:nth-child(2),
.WORKDAY[data-active="19"] .group:nth-child(19) .toggle svg:nth-child(2),
.WORKDAY[data-active="20"] .group:nth-child(20) .toggle svg:nth-child(2) {display: block;}

@media screen and (min-width: 961px) {
	.WORKDAY .filter {position: sticky; top: var(--s7);}
}

@media screen and (max-width: 1440px) {
	.WORKDAY h4 {padding-right: var(--s11);}
	.WORKDAY .toggle {margin-top: -2rem;}
}

@media screen and (max-width: 960px) {
	.WORKDAY {display: block;}
	.WORKDAY #workday-filter {width: auto; margin-bottom: var(--s5);}
	.WORKDAY #workday-feed {width: auto;}

	.WORKDAY h4 {padding-right: var(--s6);}
	.WORKDAY .count {position: static; margin: 0;}
	.WORKDAY .toggle {top: 44rem;}

	.WORKDAY a {display: block;}
	.WORKDAY a .title {display: block;}
	.WORKDAY a .location {display: block; margin: 0;}
	.WORKDAY a .label {display: none;}
}
