@use "variables" as *;

.dot-container-code__content-tab-container {
    padding: 0 $spacing-4 0 $spacing-4;
}

.dot-container-code__variable-btn {
    margin-bottom: $spacing-2;
}

.dot-container-code__empty-content {
    height: 500px;
}

.dot-container-code__empty-content-title {
    font-size: $font-size-md;
}

.dot-container-code__empty-content-subtitle {
    font-size: $font-size-sm;
}

.dot-container-code__content-tab-container ::ng-deep {
    dot-icon {
        color: $color-palette-primary;
    }

    .p-tabview {
        border: 1px solid $color-palette-gray-500;
    }

    .tab-panel-btn:first-child {
        min-height: 63.79px;
        a.p-tabview-nav-link {
            align-items: center;
            background: $color-palette-primary-500;
            border: 0;
            display: flex;
            height: 100%;
            justify-content: center;
            padding: 0;
            width: 48px;

            i {
                width: 100%;
                height: 100%;
                color: $white;
                text-align: center;
            }

            &:hover {
                background-color: $color-palette-primary-700;
                border: 0;
            }
        }
    }
}
