.dashboard-page .items {

	.card-header {

		@include media-down(xs) {
			border: none;
			flex-wrap: wrap;

			.header-block {
				display: flex;
				align-items: center;
				width: 100%;
				justify-content: space-between;
				border-bottom: 1px solid lighten($color-divider, 6%);
			}
		}

		.title {
			padding-right: 0px;
			margin-right: 5px;
		}

		.search {
			margin: 0;
			vertical-align: middle;
			display: inline-flex;
			flex-direction: row;
			align-items: center;

			$color-inactive: $color-text-muted;
			$color-active: $color-text-light;

			@include media-down(xs) {
				min-width: 50%;
			}

			.search-input {
				border: none;
				background-color: inherit;
				color: $color-inactive;
				width: 100px;
				transition: color 0.3s ease;

				@include placeholder() {
					transition: color 0.3s ease;
					color:  $color-inactive;
				}

				@include media-down(xs) {
					min-width: 130px;
				}

				&:focus {
					color: $color-active;

					@include placeholder() {
						color:  lighten($color-active, 15%);
					}

					&+.search-icon {
						color: $color-active;
					}
				}
			}

			.search-icon {
				color: $color-text-muted;
				transition: color 0.3s ease;
				order: -1;
				padding-right: 6px;
			}

		}

		
		.pagination {
			display: inline-block;
			margin: 0;
		}
	}
}