.login-page {
    background-color: #ecf0f5 !important;
}

.editor-json {
    height: 600px;
}

#consoleLog {
    border: solid 1px #999999;
    padding: 5px;
    width: 100%;
    height: 200px;
    overflow-y: scroll;
}

.space {
    margin-right: 5px;
}

.force-no-wrap {
    white-space: nowrap !important;
    overflow: hidden !important;
}

.column-shrink {
    width: 60px;
    white-space: nowrap;
}

table .form-control {
    width: 100% !important;
    max-width: 300px;
}

.global-chat-context {
    height: 200px;
    background-color: #eeeeee;
    overflow-y: scroll;
}

.custom-chart {
    height: 350px;
}

.alert-disabled {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.predefined-feedback-button {
    margin-bottom: 4px;
}

.predefined-feedback-button button:first-child {
    display: inline-block;
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.analytics-form {
    margin-bottom: 10px;
}

.select2 input::placeholder {
    padding-left: 7px !important;
    color: #999 !important;
}

.image-picker-wrapper {
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #ccc;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 6px;
    background-color: #f9f9f9;
}

.image-picker {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: 10px;
}

.image-option {
    position: relative;
    cursor: pointer;
}

.image-option input[type="radio"] {
    display: none;
}

.image-option img {
    border: 3px solid transparent;
    border-radius: 6px;
    width: 100%;
    height: 80px;
    object-fit: cover;
    transition: border 0.2s;
}

.image-option input[type="radio"]:checked + img {
    border-color: #007bff;
}

.anchor-picker {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    width: 240px;
}

.anchor-cell {
    position: relative;
}

.anchor-btn {
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
}

.anchor-btn[aria-pressed="true"] {
    outline: 2px solid #007bff;
    outline-offset: 1px;
    background: #e9f2ff;
    border-color: #007bff;
}

.anchor-legend {
    font-size: 12px;
    color: #666;
    margin-top: 6px;
}

.justification-picker {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    width: 320px;
    margin-bottom: 6px;
}

.just-btn {
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
}

.just-btn[aria-pressed="true"] {
    outline: 2px solid #007bff;
    outline-offset: 1px;
    background: #e9f2ff;
    border-color: #007bff;
}
