/*
 * Isolated CSS files are for unknown reasons not applied in production, so
 * for now CSS will be added to this file.
 */

/* General */
.disconnected {
    text-decoration: line-through;
}

/* Canvas */
.canvas-container {
    user-select: none;
    margin-bottom: 10px;
}

.canvas-container button {
    margin-right: 2px;
}

.canvas-edit {
    border: 1px solid black;
    user-select: none;
    touch-action: none;
}

.canvas-edit, .canvas-view {
    width: 100%;
    display: block;
    margin-top: -1px;
    margin-bottom: -1px;
}

.icon-button {
    display: inline-flex;
    width: 38px;
    height: 38px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.canvas-icon {
    font-size: 20px;
}

.dot {
    border-radius: 50%;
    display: inline-block;
  }

/* fix for mobile drawing */
.canvas-edit-col {
    position: static;
}

.canvas-tools {
    display: flex;
    justify-content: space-between;
}

.canvas-color-button-container {
    display: flex;
    flex-wrap: wrap;
}

.canvas-color-button {
    flex-basis: 28px;
    height: 24px;
}

/* ErrorDialog */
.error-container {
    display: flex;
    flex-direction: column;
    justify-content: space-around;

    position: absolute;
    max-width: 600px;
    min-height: 200px;
    right: 0;
    left: 0;
    top: calc(50vh - 100px);

    background: #fdfdfd;
    box-shadow: 7px 7px 14px 0px rgba(0,0,0,0.75);
}

.error-message {
    text-align: center;
    font-size: 22pt;
}