.mgz-cas-img-outer {
  position: relative;
}

.mgz-cas-preview:hover,
.mgz-cusrattr-image-preview:hover + .mgz-cas-preview {
  display: block;
}

.mgz-cas-preview {
  position: absolute;
  display: none;
  right: 0;
  top: 80%;
}

.mgz-cas-preview * {
  height: 100px;
  width: auto;
  object-fit: contain;
  background: #ffffff9c;
  padding: 15px;
  border-radius: 3px;
  border: 1px solid #5a5a5a4f;
  box-shadow: 2px 3px 3px 1px #00000026;
}

.mgz-cas-preview::before {
  content: "";
  background: #ffffff;
  width: 8px;
  height: 8px;
  display: block;
  position: absolute;
  transform: rotate(45deg);
  top: -3px;
  right: 20px;
  border: 1px solid;
  border-color: #5a5a5a4f transparent transparent #5a5a5a4f;
}

.mgz-dashboard-extra-attr-customer td {
  text-align: right;
}

.mgz-cas .mgz-cas-preview::before {
  right: 20px;
  top: -4px;
}

.mgz-cas-toogle input,
.mgz-cas-radio input[type="radio"],
.mgz-cas-checkbox input[type="checkbox"] {
  position: absolute;
  visibility: hidden;
}

.mgz-cas-radio,
.mgz-cas-checkbox {
  position: relative;
}

.mgz-cas-radio input[type="radio"] + label,
.mgz-cas-checkbox input[type="checkbox"] + label {
  display: flex;
  position: relative;
  padding: 0 1.5rem 0 0;
}

.mgz-cas-radio input[type="radio"] + label::before,
.mgz-cas-checkbox input[type="checkbox"] + label::before {
  content: '';
  position: relative;
  display: inline-block;
  margin-right: 5px;
  width: 15px;
  height: 15px;
  background: #ffffff;
  border: 1px solid;
}

.mgz-cas-checkbox input[type="checkbox"]:checked + label::after {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  border-left: 2px solid;
  border-bottom: 2px solid;
  height: 4px;
  width: 8px;
  transform: rotate(-45deg);
}

.mgz-cas-checkbox input[type="checkbox"] + label::before {
  border-radius: 3px;
}

.mgz-cas-radio input[type="radio"] + label::before {
  border-radius: 50%;
}

.mgz-cas-radio input[type="radio"]:checked + label::after {
  content: '';
  position: absolute;
  top: 5px;
  left: 5px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.mgz-cas-radio input[type="radio"]:checked + label::before {
  background: #ffffff;
}

.mgz-cas-toogle input + label {
  padding: 2px;
  width: 35px;
  background-color: #ccc;
  border-radius: 60px;
  transition: background 0.4s;
  position: relative;
  display: block;
}

.mgz-cas-toogle input + label:before,
.mgz-cas-toogle input + label:after {
  display: block;
  position: absolute;
  content: "";
}

.mgz-cas-toogle input + label:before {
      top: 1px;
      left: 1px;
      bottom: 1px;
      right: 1px;
      background-color: #fff;
      border-radius: 60px;
      transition: background 0.4s;
}

.mgz-cas-toogle input + label:after {
    border: 1px solid #ccc;
    top: -1px;
    left: -1px;
    bottom: 0;
    width: 24px;
    height: 24px;
    background-color: #fff;
  border-radius: 52px;
  transition: margin 0.4s, background 0.4s;
}

.mgz-cas-toogle input:checked + label:after {
  margin-left: 15px;
}

.mgz-cas-toogle span {
  margin: 0 15px;
}

.mgz-cas-toogle label:first-child {
  display: flex;
  height: 24px;
}

.mgz-cas .ui-datepicker {
  width: 300px !important;
  background: #ffffff;
  border: 1px solid;
  border-radius: 6px;
}

.mgz-cas .custom-file-upload + input {
  visibility: hidden;
  position: absolute;
}

.mgz-date-trigger img {
  width: 30px;
  position: absolute;
  right: 1px;
  top: 1px;
}

.mgz-date-trigger {
  position: relative;
}

.mgz-cas .ui-datepicker, .mgz-cas-radio input[type="radio"] + label::before, .mgz-cas-checkbox input[type="checkbox"] + label::before {
  border-color: #ccc !important;
}

.file-uploader-preview {
  display: none !important;
}

.mediaReview {
  display: block !important;
}