@use '../../../styles/mixins.scss';

.ydb-cluster-dashboard {
    &__dashboard-wrapper {
        gap: var(--g-spacing-6);
    }

    &__dashboard-wrapper_collapsed {
        gap: var(--g-spacing-1);

        margin-right: var(--g-spacing-4);
        margin-left: auto;
        padding-top: unset;
    }

    &__error {
        @include mixins.body-2-typography();
    }

    &__skeleton-wrapper {
        padding: unset;

        border: unset;
    }
    &__skeleton {
        height: 100%;
    }
    &__overview-wrapper {
        container-type: inline-size;
        container-name: overview-wrapper;

        border: 1px solid var(--g-color-line-generic);
        border-radius: 5px;

        .g-disclosure__trigger {
            width: 100%;
            height: 60px;
            padding: var(--g-spacing-4);
        }
    }
    &__disclosure-content {
        padding: 0 var(--g-spacing-4) var(--g-spacing-4) var(--g-spacing-4);
    }

    &__overview-wrapper_collapsed {
        &:hover {
            border-color: var(--g-color-line-generic-hover);
        }
    }

    &__card {
        min-width: 280px;
        height: 132px;
    }

    &__card_collapsed {
        min-width: 120px;
        height: 28px;
    }
}