/* whole */
html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: #222;
  font-size: 12px;
  line-height: 1.44;
  font-family: Arial, sans-serif;
  overflow: hidden;
}

.af-root.af-loading {
  visibility: hidden;
}
.af-root.af-loading.af-loaded {
  visibility: visible;
}

.af-preview-panel .af-video-container {
  position: absolute;
  inset: 0;
}

.af-preview-panel .af-loading-modal-spinner {
  width: auto;
  height: auto;
}

.af-preview-panel .af-loading-modal-spinner::after {
  position: absolute;
  inset: 0;
}

.vis-selected.vis-item.af-fixed div {
  cursor: default;
}

/* on-hold comment panel */
/* TODO 仮置き see: #8807 */
.af-on-hold-create-container {
  margin-left: auto;
}
.af-on-hold-create-container .af-on-hold-create-button {
  width: 80px;
  height: 40px;
}
.af-comment-groups .af-comment-group-header {
  height: 32px;
  align-items: center;
  padding-left: 5px;
  border: 1px solid #333;
}
.af-comment-mask-container {
  position: relative;
}
.af-comment-mask {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-color: rgb(0 0 0 / 80%);
  opacity: 0;
}
.af-comment-abstract .af-comment-mask-content {
  padding: 5px;
}
.af-comment-detail .af-comment-mask-content {
  padding: 15px 0 0 5px;
  height: calc(100% - 17px);
}
.af-comment-mask:hover {
  opacity: 1;
}
.af-comment-loading {
  justify-content: center;
}
.af-comment-loading .af-comment-loading-content {
  margin-left: 10px;
}

/* check,radio の一時対応 */
.af-checkbox-box > .icon-ok {
  position: absolute;
  top: -3px;
  color: #222;
}
.af-radio-box > .af-dot {
  display: inline-block;
  position: absolute;
  top: 3px;
  left: 3px;
  width: 6px;
  height: 6px;
  content: '';
  background-color: #555;
  border-radius: 500rem;
}