
body .viewer-container {
  z-index: calc(99999 * 9) !important;
}

.viewer-container[data-v-d1e9a6b0] {
  z-index: 9999 !important;
}
.images[data-v-d1e9a6b0] {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}
.images .sub[data-v-d1e9a6b0] {
    margin-bottom: 8px;
    margin-right: 8px;
}
.images .image[data-v-d1e9a6b0] {
    height: 0;
    padding-bottom: 75%;
    position: relative;
}
.images .image.upload .inner[data-v-d1e9a6b0] {
      font-size: 0 !important;
}
.images .image.upload .inner[data-v-d1e9a6b0]:focus {
        background-color: white;
}
.images .image.upload .upload-handle[data-v-d1e9a6b0] {
      border-radius: 4px;
      cursor: pointer;
      align-items: center;
      display: flex;
      justify-content: center;
      height: 100%;
      width: 100%;
}
.images .image.upload i.icon-upload[data-v-d1e9a6b0] {
      color: #888;
      display: block;
      font-size: 32px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      width: 40px;
}
.images .image .inner[data-v-d1e9a6b0] {
      align-items: center;
      background-color: rgba(233, 236, 247, 0.5);
      border-radius: 4px;
      border: 4px #e9ecf7 solid;
      display: flex;
      justify-content: center;
      bottom: 0;
      left: 0;
      overflow: hidden;
      position: absolute;
      right: 0;
      top: 0;
      z-index: 1;
}
.images .image .inner video[data-v-d1e9a6b0],
      .images .image .inner iframe[data-v-d1e9a6b0] {
        height: 100%;
        width: 100%;
}
.images .image .inner img[data-v-d1e9a6b0] {
        cursor: zoom-in;
        max-height: 100%;
        max-width: 100%;
        transition: all 0.3s ease;
}
.images .image .inner legend[data-v-d1e9a6b0] {
        background-color: rgba(0, 0, 0, 0.8);
        color: #fff;
        font-size: 1rem;
        padding: 4px 8px;
        position: absolute;
        z-index: 2;
        left: 0;
        right: 0;
        bottom: 0;
}
.images .image .icon-file[data-v-d1e9a6b0] {
      font-size: 24px;
}
.images .image .download[data-v-d1e9a6b0] {
      background-color: rgba(0, 0, 0, 0.8);
      color: #fff;
      cursor: pointer;
      font-size: 12px;
      height: 24px;
      line-height: 24px;
      padding: 0 8px;
      position: absolute;
      right: 5px;
      top: 5px;
      z-index: 2;
}
.images .image .download[data-v-d1e9a6b0]:hover {
        background-color: rgba(0, 0, 0, 0.7);
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}
.images .image .remove[data-v-d1e9a6b0] {
      background-color: #ec0e0e;
      border-radius: 4px;
      color: #fff;
      cursor: pointer;
      font-size: 12px;
      height: 24px;
      line-height: 24px;
      padding: 0 8px;
      position: absolute;
      left: 10px;
      top: 10px;
      text-align: center;
      transition: all 0.3s ease;
      z-index: 2;
}
.images .image .file-name[data-v-d1e9a6b0] {
      color: #fff;
      background-color: rgba(0, 0, 0, 0.5);
      border-radius: 0 0 3px 3px;
      -webkit-backdrop-filter: blur(10px);
              backdrop-filter: blur(10px);
      font-size: 12px;
      left: 0;
      bottom: 0;
      right: 0;
      overflow: hidden;
      padding: 0 8px;
      position: absolute;
      text-overflow: ellipsis;
      white-space: nowrap;
      z-index: 3;
}
.images .image:hover img[data-v-d1e9a6b0] {
      opacity: 0.5;
      transform: scale(1.1);
}
.images .image:hover .download[data-v-d1e9a6b0] {
      transform: scale(1);
}
.images .title[data-v-d1e9a6b0] {
    text-align: center;
}

