:root {
    --rz-primary: #8F00FF;
    --rz-primary-lighter: #E9CCFF;
}

.confidence-high {
    color: green;
}

.confidence-medium {
    color: goldenrod;
}

.confidence-low {
    color: red;
}

.editor-content {
    resize: none;
    width: 100%;
    height: auto;
    font-size: 1.2em;
    border: none;
}

/* ---------------------------------------------------------------------------- */
/* Loading spinner                                                              */
/* ---------------------------------------------------------------------------- */

.test {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.spinner-circle {
    width: 100px;
    height: 100px;
    position: relative;
    margin: 40px;
}

.spinner {
    height: 100%;
    width: 100%;
    border-radius: 50%;
    border: 5px solid #8F00FF;
    border-right: 5px solid #15D9ED;
    animation: rotate--spinner 1.6s linear infinite;
    box-sizing: border-box;
}

.icon {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font-size: 50px;
}

@keyframes rotate--spinner {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

/* ---------------------------------------------------------------------------- */
/* FFMPEG audio selection                                                       */
/* ---------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------- */
/* Error indicator                                                              */
/* ---------------------------------------------------------------------------- */

#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}

/* ---------------------------------------------------------------------------- */
/* Shopping Cart                                                                */
/* ---------------------------------------------------------------------------- */

.fa[data-count] {
    position: relative;
}

.fa[data-count]:after {
    position: absolute;
    right: -0.75em;
    top: -0.75em;
    content: attr(data-count);
    padding: 0.4em;
    border-radius: 10em;
    line-height: 0.9em;
    color: white;
    background: rgba(255, 0, 0, 0.75);
    text-align: center;
    min-width: 2em;
    font: bold 0.4em sans-serif;
}

/* ---------------------------------------------------------------------------- */
/* Radzen styles                                                                */
/* ---------------------------------------------------------------------------- */