// Copyright (C) 2020-2022 Intel Corporation
// Copyright (C) 2022-2023 CVAT.ai Corporation
//
// SPDX-License-Identifier: MIT

@import './base.scss';

$highlight-color: #1890ff;
$highlight-active: #40a9ff;

hr {
    border: none;
    border-top: 1px solid $border-color-1;
    height: 1px;
}

.cvat-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.cvat-disconnected {
    font-size: 36px;
}

.cvat-spinner-container {
    position: absolute;
    background: $background-color-1;
    opacity: 0.5;
    width: 100%;
    height: 100%;
    z-index: 2;
    top: 0;
    left: 0;
}

.cvat-not-found {
    margin: 10% 25%;
}

.cvat-text-color {
    color: $text-color;
}

.cvat-title {
    font-weight: 400;
    font-size: 21px;
    color: $text-color;
    padding-top: 5px;
}

.ant-slider {
    > .ant-slider-track {
        background-color: $slider-color;
    }

    > .ant-slider-handle {
        border-color: $slider-color;
    }
}

.ant-notification {
    top: $header-height !important;
    right: 0 !important;
    margin-right: 0;
}

.cvat-info-circle-icon {
    color: $info-icon-color;
    margin-left: $grid-unit-size;
    margin-right: $grid-unit-size;
}

.cvat-danger-circle-icon {
    color: $danger-icon-color;
}

#root {
    width: 100%;
    height: 100%;
    display: grid;
    min-width: 1024px;
}

#layout-grid {
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    pointer-events: none;
}

.cvat-cloud-storage-select-provider {
    display: flex;
    justify-content: flex-start;
    align-items: center;

    > svg {
        margin-right: $grid-unit-size;
    }
}

.cvat-divider {
    margin: $grid-unit-size * 0.5 0;
}

.cvat-advanced-configuration-wrapper {
    .ant-collapse-header {
        align-items: center !important;
    }

    .cvat-title {
        padding-top: 0;
    }
}

.cvat-menu-item-highlighted {
    color: white;
    background: $highlight-color;

    &:hover {
        background: $highlight-active;
    }
}

.ant-notification-notice {
    p {
        margin-bottom: 0;
    }
}
