/**
 * Heading
 */
#hskea h2 {
	margin-top: 2em;
}

#hskea h2:first-of-type {
	margin-top: 0em;
}

/**
 * Anchor
 */
#hskea a {
	color: inherit;
}

/**
 * Button
 */
#hskea button {
	padding: 0.4em 0.8em;
	position: relative;

	border: 1px solid #d9d9d9;
	border-radius: 4px;

	font-size: 1em;
	line-height: 1;

	cursor: default;
	color: inherit;
	background-color: #f4f4f4;
}

#hskea button:hover {
	background-color: rgba(0, 0, 0, 0.05125);
}

#hskea button:active {
	background-color: rgba(0, 0, 0, 0.125);
}

#hskea button a {
	font-size: inherit;
	cursor: pointer;
}


/** SVG Loader */
#hskea button a svg {
	transition: left 0.2s;

	display: inline-block;
	visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 100%;

	opacity: 0;
	fill: #555;
}

#hskea button[type="submit"]:focus-within a.animate svg,
#hskea button:focus-within a:focus.animate svg {
	visibility: visible;
	opacity: 1;
}

/** Text */
#hskea button[type="submit"]:focus-within a span.label,
#hskea button:focus-within a:focus span.label,
#hskea button a span.label {
	transition: opacity 0.2s;
}

#hskea button[type="submit"]:focus-within a.animate span.label,
#hskea button:focus-within a:focus.animate span.label {
	opacity: 0;
}


/**
 * Table
 */
#hskea table.hskea_list {
	display: block;
	max-height: 80vh;
	overflow: auto;
}

#hskea thead {
	position: sticky;
	top: 0;
	z-index: 10;

	background-color: #fff;
}

#hskea tbody tr:nth-of-type(even) {
	background-color: rgba(0, 0, 0, 0.025);
}

#hskea tbody tr:hover {
	background-color: rgba(0, 0, 0, 0.05);
}

#hskea tbody tr td span.column_title {
	display: none;
}

/** Locked */
#hskea tbody tr.hskea_locked {
	opacity: 0.5;
}

/** Options */
#hskea tbody tr td.hskea_options > * {
	opacity: 0;
}

#hskea tbody tr td.hskea_options p {
	overflow: hidden;
	text-overflow: ellipsis;
}

#hskea tbody tr:hover td.hskea_options > * {
	opacity: 1;
}

/** Details */
#hskea table.hskea_details {
	width: auto;
	margin-bottom: 5em;
}

/**
 * Form
 */
#hskea form#hskea_login input {
	position: absolute;
	padding: 0;
	margin: 0;
	width: 0;
	height: 0;
	top: -999%;
	left: -999%;
	z-index: -1;
}


/**
 * Row
 */
#hskea div.hskea_row {
	display: flex;
	flex-flow: row wrap;
	max-width: 100%;

	margin: -0.2em -0.4em;
}

#hskea div.hskea_row.space-between {
	justify-content: space-between;
}

#hskea div.hskea_row * {
	max-width: 100%;
}

#hskea div.hskea_row > * {
	flex: 0 0 auto;

	margin: 0.2em 0.4em;
}

#hskea div.hskea_row.grow > * {	flex-grow: 1; }
#hskea div.hskea_row.shrink > * {	flex-shrink: 1; }

#hskea div.hskea_row > *:last-child {
	margin-right: 0;
}

/** Grid */
#hskea .hskea_grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-gap: 0.4em 0.8em;
}

#hskea div.hskea_row,
#hskea .hskea_grid {
	margin-bottom: 1em;
}

#hskea div.hskea_row_min {
	margin-bottom: 0;
}

/** Checkbox */
#hskea .hskea_grid label {
	padding: 0.4em 0.8em;
	white-space: nowrap;

	cursor: pointer;
	background-color: #f4f4f4;
	border: 1px solid #d9d9d9;
	border-radius: 3px;
}

#hskea .hskea_grid label input:checked {
	color: white;
}

/** Textarea */
#hskea textarea {
	height: 30vh;
}

/**
 * Message
 */
#hskea div.hskea_message {
	padding: 0.4em 0.8em;
	margin-bottom: 1em;

	background-color: #fff;

	border: 1px dashed #d9d9d9;
}

#hskea div.hskea_message:before {
	content: '\f348';

	margin-right: 0.4em;

	font-family: 'dashicons';
	font-size: 2em;
	vertical-align: middle;
}

#hskea div.hskea_message.note {	background-color: #ffeeaa; border-color: #ffe680; color: #333; }
#hskea div.hskea_message.note:before { content: '\f348'; color: #ffe680; }
#hskea div.hskea_message.warning { background-color: #ffb380; border-color: #ff7f2a; color: #333; }
#hskea div.hskea_message.warning:before { content: '\f534'; color: #ff7f2a; }
#hskea div.hskea_message.error { background-color: #ff8080; border-color: #ff5555; color: #333; }
#hskea div.hskea_message.error:before { content: '\f153'; color: #ff5555; }
#hskea div.hskea_message.success { background-color: #aade87; border-color: #8dd35f; color: #333; }
#hskea div.hskea_message.success:before { content: '\f12a'; color: #8dd35f; }

/**
 * Icon
 */
#hskea .icon {
	transition: padding-left 0.2s, padding-right 0.2s;
	padding-left: 1.4em;
}

#hskea .icon:before {
	transition: left 0.2s, opacity 0.2s;

	position: absolute;
	left: 0.8em;
	top: calc(50% - 0.45em);

	font-family: 'dashicons';
	font-size: 1em;
}

#hskea .icon.open:before { content: '\f177'; }
#hskea .icon.delete:before { content: '\f158'; }
#hskea .icon.add:before { content: '\f132'; }
#hskea .icon.revert:before { content: '\f531'; }
#hskea .icon.return:before { content: '\f474'; }
#hskea .icon.update:before { content: '\f147'; }
#hskea .icon.login:before { content: '\f120'; }

/** Button */
#hskea button[type="submit"]:focus-within a.icon.animate:before,
#hskea button:focus-within a:focus.icon.animate:before,
#hskea button a.icon:hover:before {
	opacity: 0;
	left: calc(50% - 0.5em);
}

#hskea button a.icon:hover,
#hskea button:focus-within a.icon {
	padding-left: 0.7em;
	padding-right: 0.7em;
}


/**
 * Brands
 */
#hskea label.show {
	display: block;
}

#hskea label.hide {
	display: none;
}

#hskea #company_brands_search {
	margin-bottom: 1em;
}


/**
 * Responsive
 */
@media (max-width: 1366px) {

	/** Options */
	#hskea table.hskea_list tbody tr td.hskea_options > * {
		opacity: 1;
	}

}

@media (max-width: 1280px) {

	/** Grid */
	#hskea .hskea_grid {
		grid-template-columns: repeat(5, 1fr);
	}

}

@media (max-width: 1024px) {

	/** Table */
	#hskea table.hskea_list,
	#hskea table.hskea_list thead,
	#hskea table.hskea_list tbody,
	#hskea table.hskea_list th,
	#hskea table.hskea_list td,
	#hskea table.hskea_list tr {
		border: none;
		position: relative;
	}

	#hskea table.hskea_list tr th,
	#hskea table.hskea_list tr td {
		padding: 0.2em 0.4em;
	}

	#hskea table.hskea_list tbody tr {
		border-top: 1px solid #d9d9d9;
	}

	/** Grid */
	#hskea .hskea_grid {
		grid-template-columns: repeat(3, 1fr);
	}

	/** Text */
	#hskea table.hskea_list button a span.label {
		display: none;
	}

	/** Icon */
	#hskea table.hskea_list .icon:before {
		left: calc(50% - 0.5em);
	}

}

@media (max-width: 768px) {

	/** Table */
	#hskea table.hskea_list table,
	#hskea table.hskea_list thead,
	#hskea table.hskea_list tbody,
	#hskea table.hskea_list th,
	#hskea table.hskea_list td,
	#hskea table.hskea_list tr {
		display: block;
	}

	#hskea table.hskea_list thead,
	#hskea table.hskea_list td:empty {
		display: none;
	}

	#hskea table.hskea_list tbody tr {
		padding: 0.8em 0;
		border-top: none;
		border-bottom: 1px solid #d9d9d9;
	}

	#hskea table.hskea_list tbody tr:hover {
		background-color: inherit;
	}

	#hskea table.hskea_list tbody tr td {
		padding: 0;
	}

	#hskea table.hskea_list tbody tr td.hskea_options {
		padding: 0.4em 0;
	}

	#hskea table.hskea_list tbody tr td span.column_title {
		display: inline-block;
		font-weight: bolder;
	}

	#hskea table.hskea_list tbody tr td span.column_title:after {
		content: '\00a0';
	}

	/** Options */
	#hskea table.hskea_list tbody tr td.hskea_options > * {
		opacity: 1;
	}

	/** Grid */
	#hskea .hskea_grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/** Text */
	#hskea table.hskea_list button a span.label {
		display: inline-block;
	}

	/** Icon */
	#hskea table.hskea_list .icon:before {
		left: 0.8em;
	}

}