.mk-evidence-title {
	.mk-evidence-heading {
		margin: 0 0 7px;
		font-size: 0.875rem;
		font-weight: 700;
		letter-spacing: 0;
		color: var(--#{$variable-prefix}eerie-black);
	}
	.mk-evidence-desc {
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0;
		color: #666666;
		opacity: 1;
	}
}

.mk-evidence-thumbnail {
	border-color: #efefef;
}

.mk-card-info {
	margin: 3px 0 0;
	max-width: 388px;
	h5 {
		font-weight: 700;
	}
	.mk-status-wrapper {
		font-size: 0.75rem;
		letter-spacing: 0;
		color: var(--#{$variable-prefix}eerie-black);
		strong {
			opacity: 1;
		}
		span {
			margin-right: 4px;
			opacity: 0.6;
      svg{
        margin-top: -3px;
        margin-right: 4px;
      }
		}
	}
}

.mk-thumbnail-desc {
	.course-image {
		width: 125px;
		height: 70px;
		object-fit: cover;
		border-radius: 5px;
	}
}

.mk-evidence-header {
	h1 {
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0;
		color: var(--#{$variable-prefix}eerie-black);
	}
	.mk-header-action-wrapper {
		a,
		button {
			&.mk-btn-gray-custom {
				background: #f2f2f2;
				border-color: #f2f2f2;
			}
		}
	}
}

.mk-evidence-inputs-wrapper {
	display: flex;
	align-items: start;
	justify-content: space-between;
  flex-wrap: wrap;
  @media(max-width: 768px){
    display: block;
  }
}

.mk-evidence-fields {
	border-color: #efefef;
	.mk-evidence-header {
		padding-top: 11px;
		padding-bottom: 11px;
		border: 1px solid rgb(234 235 239 / 50%);
		.mk-evidence-heading {
			margin: 0;
			line-height: 22px;
		}
	}
	.mk-left-col-wrapper {
		flex: 1;
		max-width: 484px;
		.form-floating > .form-control:not(:placeholder-shown):disabled {
      color: var(--#{$variable-prefix}eerie-black);
			border-color: #efefef;
		}
	}
	.mk-rigt-col-wrapper {
		margin-top: 6px;
	}
}

.mk-file-wrapper {
	.form-control {
		color: var(--#{$variable-prefix}eerie-black);
		&::-webkit-file-upload-button {
			background: #dee0e3;
		}
		&::-webkit-file-upload-button {
			color: var(--#{$variable-prefix}eerie-black);
			border-color: #cdd3de;
		}
    &.mk-plain-file-upload{
      &::-webkit-file-upload-button {
        display: none;
      }
    }
	}
  &.mk-upload-success{
    .form-control {
      &::-webkit-file-upload-button {
        margin-inline-end: 2rem;
      }
      &:before{
        position: absolute;
        top: 15px;
        left: 110px;
        width: 18px;
        height: 18px;
        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktcGFwZXJjbGlwIiB2aWV3Qm94PSIwIDAgMTYgMTYiPgogIDxwYXRoIGQ9Ik00LjUgM2EyLjUgMi41IDAgMCAxIDUgMHY5YTEuNSAxLjUgMCAwIDEtMyAwVjVhLjUuNSAwIDAgMSAxIDB2N2EuNS41IDAgMCAwIDEgMFYzYTEuNSAxLjUgMCAxIDAtMyAwdjlhMi41IDIuNSAwIDAgMCA1IDBWNWEuNS41IDAgMCAxIDEgMHY3YTMuNSAzLjUgMCAxIDEtNyAwVjN6Ii8+Cjwvc3ZnPg==);
        background-size: 15px 18px;
        background-repeat: no-repeat;
        content: '';
      }
      &.mk-plain-file-upload{
        padding-left: 2rem;
        &::-webkit-file-upload-button {
          display: none;
        }
        &:before{
          left: 10px;
        }
      }
    }
  }
}

.was-validated {
	.mk-file-wrapper {
		.form-control {
			&:invalid,
			&.is-invalid {
        color: #f46582;
        background: #FFF7F8;
				&::-webkit-file-upload-button {
          color: #f46582;
					background: #ffd9e1;
          border-color: #f46582;
				}
			}
		}
	}
  .form-control {
    &:invalid,
    &.is-invalid {
      color: #f46582;
      background: #FFF7F8;
    }
  }
  .form-floating > label{
    color: #f46582;
  }
}

.mk-field-button-group{
  position: relative;
  .mk-fly-button{
    position: absolute;
    top: 9px;
    left: calc(100% + 10px);
    width: max-content;
    color: var(--#{$variable-prefix}primary-color-hex);
    @media (max-width: 991px){
      position: static;
      margin-bottom: 20px;
    }
  }
}

.mk-btn-danger-custom{
  color: #e36e83;
  background-color: #fff2f4;
  border-color: #fff2f4;
  &:hover,
  &:focus{
    color: #e36e83;
    background-color: #fff2f4;
    border-color: #fff2f4;
  }
}

.mk-block-error{
  color:#e36e83;
  strong{
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0;
  }
  p{
    margin: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0;
  }
}

// Evidence Block in courses
.mk-evidence-info-wrapper {
  border-color: #d2d7db;
  .mk-evidence-title{
    max-width: 458px;
    .mk-evidence-heading{
      font-size: .75rem;
    }
    .mk-evidence-desc{
      color: #76777a;
      strong{
        color: var(--#{$variable-prefix}eerie-black);
      }
    }
  }
  .card-body{
    padding: 1.25rem;
  }
}